Format differs depending on @media context

[JakeTheSnake3p0]

Formatting these two examples produces differing results. Each example shows the final layout; one obvious difference is the lack of new line characters in between blocks.

With @media ...

@media handheld,
       only screen and (max-width: 760px) {
  .no-mobile {
    display : none;
  }
    /*Turns off grey BG behind logo*/
  nav.main {
    background-color : transparent;
  }
  nav.main a {
    color : #000;
  }
    /*Make quicklinks dropdown big*/
  #site_navigation {
    width  : 100%;
    height : 2.5em;
    margin : 0;
  }
  .image-select {
    width  : 100%;
    margin : 0 0 2em 0;
  }
  .image-select .container {
    margin : 0 auto;
  }
  nav.big {
    display : none;
  }
}

Without @media...

.no-mobile {
  display : none;
}

/*Turns off grey BG behind logo*/

nav.main {
  background-color : transparent;
}

nav.main a {
  color : #000;
}

/*Make quicklinks dropdown big*/

#site_navigation {
  width  : 100%;
  height : 2.5em;
  margin : 0;
}

.image-select {
  width  : 100%;
  margin : 0 0 2em 0;
}

.image-select .container {
  margin : 0 auto;
}

nav.big {
  display : none;
}

I would expect the result to look more like the "without @media" example.

[SeanJM]

That's been on my to-do, and still is. :) Do you code Javascript?

[JakeTheSnake3p0]

Technically yes, but I would never claim proficiency with it :. Really only enough to get by on web pages, sorry. I'm also swamped - but if you could point me in the direction of the offending code perhaps I can take a look at the very least.

[SeanJM]

I have done it, it's going to come in an upcoming release after I test it for a few days. I actually will need to refactor the code to make it clearer for someone else to come into it... It is clean-ish--but definitely not as clear as it could be.

[SeanJM]

Fixed