simplified divs

index.html

@@ -11,7 +11,6 @@
   <!-- div to display container, tabs, and map; add more for title and caption if desired -->
   <div class="interactiveContainer">
     <div class="tabBar">
-      <!-- to do: method to use keyboard to flip through tabs; tried tabindex="1" etc. -->
       <div class="tabItem selected">1910</div>
       <div class="tabItem">1920</div>
       <div class="tabItem">1930</div>
@@ -24,9 +23,7 @@
       <div class="tabItem">2000</div>
       <div class="tabItem">2010</div>
     </div>
-    <div class="mapContainer">
-      <div id="map">
-    </div>
+      <div id="map"></div>
     </div>
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
     <!-- Current Leaflet is beta. Check for updates at http://leafletjs.com/download.html -->

style.css

@@ -1,34 +1,20 @@
-/*Edit max-width to fit inside destination iframe*/
 .interactiveContainer {
-    float: left;
     width: 100%;
-    max-width: 700px;
-    border-top: 1px solid #ccc;
-    border-bottom: 1px solid #ccc;
-    border: none !important;
     font-family: Arial, sans-serif;
 }
-.mapContainer {
-    float: left;
-    width: 100%;
-    height: 500px;
-    position: relative;
-    border: 1px solid #aaa;
-}
+/* Edit top to fit tabBar height: 35px */
+/* Edit height to display full map: 500px */
 #map {
     position: absolute;
     left: 0;
-    top: 0;
+    top: 35px;
     width: 100%;
-    height: 100%;
+    height: 500px;
 }
 .tabBar {
-    float: left;
-    width: 100%;
-    margin-bottom: 10px;
     font: 14px/16px Arial, Helvetica, sans-serif;
 }
-/* Edit tab width based on number to be displayed
+/* Edit width based on number of tabs to display
 In this example, width = 9% for 10 tabs + cell borders */
 .tabItem {
     width: 9%;
@@ -99,10 +85,9 @@ In this example, width = 9% for 10 tabs + cell borders */
     float: left;
     width: 70%;
     font-size: 14px;
-    /*color: maroon;*/
-    /*margin-top: 1px;*/
     font-family: Arial, sans-serif;
 }
+/*Edit width of legend*/
 .legend {
     width: 100px;
     position: absolute;