CSS media query height greater than width and vice versa (or how to imitate with JavaScript)

Question

The majority of desktop and laptop screens nowadays have a width greater than the height. The screen is \"wide\" not \"tall.\" Smart phones have done something rather cool b

Answer 1

Media Queries are probably going to be your solution here for the modern browsers that support it. You can grab a copy of the documentation from here:

http://www.w3.org/TR/css3-mediaqueries/

But you might find the following tutorial useful (Google for: Media Queries Tutorial):

http://webdesignerwall.com/tutorials/css3-media-queries

Once you pick up the basics doing things like hiding elements if the screen falls below a specific resolution:

@media screen and (max-width: 600px)
{
  .sidebar
  {
    display: none;
  }
}

Hope this helps.