Fixup scrolling

css/app.css

@@ -78,6 +78,7 @@ table th {
 #map {
     display:block;
     position:absolute;
+    overflow:hidden;
     top:45px;
     left:0;
     right:0;
@@ -147,6 +148,7 @@ div.buttons-joined {
 #bar div.buttons-joined button:first-child {
     border-radius:3px 0 0 3px;
 }
+
 #bar div.buttons-joined button:last-child {
     border-right:0;
     border-radius:0 3px 3px 0;
@@ -164,12 +166,14 @@ div.buttons-joined {
 }
 
 .user {
-    width:150px;
+    width:200px;
     position:absolute;
     bottom:10px;
     left:10px;
     background:#fff;
-    padding:10px;
+    padding:2px 5px;
+    border-radius:3px;
+    border:1px solid #aaa;
 }
 
 .user .logout {
@@ -361,46 +365,49 @@ div.typeahead a.active {
 }
 
 #bar button .tooltip {
-  white-space: normal;
-  }
+    white-space: normal;
+}
+
 .tooltip {
-  position: absolute;
-  z-index: 1030;
-  display: block;
-  padding: 5px;
-  font-size: 11px;
-  opacity: 0;
-  filter: alpha(opacity=0);
-  visibility: visible;
+    position: absolute;
+    z-index: 1030;
+    display: block;
+    padding: 5px;
+    font-size: 11px;
+    opacity: 0;
+    filter: alpha(opacity=0);
+    visibility: visible;
 }
 
 .tooltip.in {
-  opacity: 0.8;
-  filter: alpha(opacity=80);
+    opacity: 0.8;
+    filter: alpha(opacity=80);
 }
 
 .tooltip-inner {
-  max-width: 200px;
-  padding: 3px 8px;
-  color: #ffffff;
-  text-align: center;
-  text-decoration: none;
-  background-color: #000000;
-  -webkit-border-radius: 4px;
-     -moz-border-radius: 4px;
-          border-radius: 4px;
+    max-width: 200px;
+    padding: 3px 8px;
+    color: #ffffff;
+    text-align: center;
+    text-decoration: none;
+    background-color: #000000;
+    -webkit-border-radius: 4px;
+    -moz-border-radius: 4px;
+    border-radius: 4px;
 }
+
 .tooltip-arrow {
-  position: absolute;
-  width: 0;
-  height: 0;
-  border-color: transparent;
-  border-style: solid;
+    position: absolute;
+    width: 0;
+    height: 0;
+    border-color: transparent;
+    border-style: solid;
 }
+
 .tooltip.bottom .tooltip-arrow {
-  top: 0;
-  left: 50%;
-  margin-left: -5px;
-  border-bottom-color: #000000;
-  border-width: 0 5px 5px;
+    top: 0;
+    left: 50%;
+    margin-left: -5px;
+    border-bottom-color: #000000;
+    border-width: 0 5px 5px;
 }

js/id/id.js

@@ -68,6 +68,9 @@ window.iD = function(container) {
         bar.append('button')
             .attr('class', 'save')
             .html("Upload<small id='as-username'></small>")
+            .attr('title', 'Save changes to OpenStreetMap, making them visible to other users')
+            .call(bootstrap.tooltip()
+                .placement('bottom'))
             .on('click', function() {
                 function save(e) {
                     d3.select('.shaded').remove();