title: Media queries PX vs EM vs REM
body: <p>Can anyone explain why my media queries break when converting them FROM px TO ems</p>
  <p>In the body of my document, I have included the following rule
  font-size: 62.5%, Therefore I would assume that I could convert my media query to FROM 650px to 65em? Changing my media queries to ems breaks the layout</p>
  <p>As an alternative, can I convert the media query to REMS with a pixel fallback ?? that said, I have no idea how to do this</p>
  <pre class="lang-css prettyprint-override"><code>@media screen and (min-width: 650px) {     
    body {
      font-size: 62%;
      background-color: #364759;
      background-repeat: repeat-x;
      background: url(&quot;bg.gif&quot;);
    }
      
    #wrapper, footer {
      width: 80%;
      max-width: 1050px;
      margin: 0 auto;
    }
  } // end media query 
  </code></pre>
  <p>many thanks, P</p>