<p>In <a href="https://github.com/openstreetmap/openstreetmap-website/pull/1240#discussion_r67932693">app/assets/stylesheets/common.scss</a>:</p>
<pre style='color:#555'>> @@ -546,6 +547,13 @@ body.compact {
>      background: #fff;
>      font-size: 12px;
>  
> +    > div {
> +      position: relative;
> +      float: left;
> +      clear: both;
> +      width: 100%;
> +    }
> +
</pre>
<p>Oh gotcha - under <code>#sidebar</code> we have</p>

<ul>
<li><code>div.search_forms</code></li>
<li><code>div#flash</code></li>
<li><code>div#browse_status</code></li>
<li>
<code>div#sidebar_loader</code>  (hidden spinner)</li>
<li><code>div.welcome</code></li>
<li><code>div#banner</code></li>
</ul>

<p>The <code>float:left; clear:both; width:100%;</code> makes it so that they all take up the full width of the sidebar and don't overlap.  <code>position:relative</code> is so that any absolutely positioned inner div (like <code>close-wrap</code>) gets positioned off of its parent div, rather than relative to the sidebar or some other nearby div.  It's useful for all toplevel divs under the sidebar to have this rule because they might not all be there (e.g. if user has dismissed the welcome div).</p>

<p style="font-size:small;-webkit-text-size-adjust:none;color:#666;">—<br />You are receiving this because you are subscribed to this thread.<br />Reply to this email directly, <a href="https://github.com/openstreetmap/openstreetmap-website/pull/1240/files/933335a0ea28f274bc7301c18611bcd90709fd99#r67932693">view it on GitHub</a>, or <a href="https://github.com/notifications/unsubscribe/ABWnLfLAmLXH0RKxaZ0qOKU5JOwHduO2ks5qODcHgaJpZM4I6MD6">mute the thread</a>.<img alt="" height="1" src="https://github.com/notifications/beacon/ABWnLUdArqwker8tG9EPuaqZRPr-iE1_ks5qODcHgaJpZM4I6MD6.gif" width="1" /></p>
<div itemscope itemtype="http://schema.org/EmailMessage">
<div itemprop="action" itemscope itemtype="http://schema.org/ViewAction">
  <link itemprop="url" href="https://github.com/openstreetmap/openstreetmap-website/pull/1240/files/933335a0ea28f274bc7301c18611bcd90709fd99#r67932693"></link>
  <meta itemprop="name" content="View Pull Request"></meta>
</div>
<meta itemprop="description" content="View this Pull Request on GitHub"></meta>
</div>