JS window size class
Out of context: Reply #4
- Started
- Last post
- 7 Responses
- Hombre_Lobo0
Like spmitch said, it sounds like you're looking for. CSS media queries, like so -
@media only screen and (max-width: 48.75em) {
.eight-column {width:100%}
.project-thumb {width:45%;}
.nav {width: 80%;}
}(That's just some code scraped from a site I building)
The width element can use pixels or em (and others too).
I'd highly recommend you use em rather than pixels.Querying the width of a device in pixels, then displaying your content based on that information is difficult given different pixel densities on different devices.
If you use ems you will reference the base font size of that browser (usually 16) , then measure how many times that fits across the device, which will have a much better idea of what size elements should be on that given device.
Hope that makes sense!