<p>The key issue here is <a href="https://github.com/openstreetmap/openstreetmap-website/blob/master/app/assets/stylesheets/common.scss#L447">https://github.com/openstreetmap/openstreetmap-website/blob/master/app/assets/stylesheets/common.scss#L447</a> which controls when we collapse things to the compact view.</p>

<p>It's currently set to a screen width of 960px but that value unfortunately varies by language, and could change at any time as translations are updated... Sadly you can't use <code>calc()</code> in media queries to try and dynamically calculate the right value...</p>

<p style="font-size:small;-webkit-text-size-adjust:none;color:#666;">—<br>Reply to this email directly or <a href="https://github.com/openstreetmap/openstreetmap-website/issues/1014#issuecomment-123739052">view it on GitHub</a>.<img alt="" height="1" src="https://github.com/notifications/beacon/ABWnLcGbqShk0pRWUYy-Uc3Z9ApMJ_2-ks5of56igaJpZM4Fdljg.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/issues/1014#issuecomment-123739052"></link>
    <meta itemprop="name" content="View Issue"></meta>
  </div>
  <meta itemprop="description" content="View this Issue on GitHub"></meta>
</div>