html and style fixes

html/force.css

@@ -14,8 +14,3 @@ line.link {
 
 #chart {
 }
-
-body {
-  padding: 0;
-  margin: 0;
-}

html/force.js

@@ -1,5 +1,18 @@
-var w = window.innerWidth,
-    h = window.innerHeight - 10,
+function getOffset( el ) {
+    var _x = 0;
+    var _y = 0;
+    while( el && !isNaN( el.offsetLeft ) && !isNaN( el.offsetTop ) ) {
+        _x += el.offsetLeft - el.scrollLeft;
+        _y += el.offsetTop - el.scrollTop;
+        el = el.offsetParent;
+    }
+    return { top: _y, left: _x };
+}
+
+var offset = getOffset(document.getElementById('chart'));
+
+var w = window.innerWidth - offset.left,
+    h = window.innerHeight - offset.top - 24,
     fill = d3.scale.category20();
 
 var vis = d3.select("#chart").append("svg")

html/geomap.html

@@ -3,36 +3,12 @@
   <link rel="stylesheet" href="theme/default/style.css" type="text/css" />
 
   <style type="text/css">
-    body, html {
-      margin: 0; padding: 0;
-    }
     #map {
     float: left;
-    width: 80%;
+    width: 100%;
 
     box-sizing:border-box;
 
-    }
-    #infobox {
-    box-sizing:border-box;
-    width: 20%;
-    vertical-align: top;
-    float: right;
-    padding: 1em;
-    }
-    body {
-    font:80%/100% 'helvetica neue',sans-serif,'arial';
-    color: #666;
-    }
-    h2 {
-      margin: 0 0 1em;
-      color: #f60;
-    }
-    li {
-      margin-bottom: 0.5em;
-    }
-    ul {
-      padding-left: 2em;
     }
     .olPopup p { margin:0px; }
   </style>

html/nodes.html

@@ -11,8 +11,7 @@
       <li><a href="geomap.html">Knotenkarte</a></li>
     </ul>
     <h2>Knotenkarte</h2>
-    <div id="map"></div>
-    <div id='chart'> </div>
+    <div id="chart"></div>
     <link href='force.css' rel='stylesheet' type='text/css' />
     <script type="text/javascript" src="d3.js"></script>
     <script src='d3.layout.js' type='text/javascript'> </script>