Tag: media

The practicalities of CSS Media Queries, lessons learned

CSS Media Queries are part of CSS3 and in brief: they allow you to tailor your websites appearance for different screen sizes. Most people I speak to know about media queries but have been a little shy in trying them out. You can read about media queries elsewhere – here, I’d like to speak about […]
csshead 0 Comments

Hardboiled CSS3 Media Queries

Since I started using Media Queries extensively over the last few months, I’ve revised the queries several times for each project, so it made sense to build a boilerplate to use as a starting point. These hardboiled CSS3 Media Queries are empty placeholders for targeting the devices and attributes I’m interesting in making responsive designs […]
csshead 0 Comments

Demystifying CSS At-Rules

CSS at-rules or @rules are so-named because they utilize an @ character. They aren’t used as often as other CSS elements, and for a long time I didn’t really understand them. If you’ve ever been confused about CSS at-rules, here’s a quick guide…
csshead 0 Comments

Detecting device size & orientation in CSS

Gone are the days when we could safely assume that most our site visitors would have at least a 1024px-wide screen resolution. With smartphones and tablet computers on the rise, you visitors could also be browsing the web with screen widths ranging from 320px upwards. Does your site look good on a 768px-wide canvas? That’s […]
csshead 0 Comments

10 Tips for Better Print Style Sheets

Print style sheets have been somewhat forgotten, and yet they remain important all the same. Many people print out articles to read while traveling or when they have no access to the Internet. Print style sheets have definite benefits. For example, reading on paper is less tiring on the eyes than reading on screen. Also, […]
csshead 0 Comments

Mobile Optimised Websites Using CSS3 Media Queries

CSS3 Media Queries can be used in conjunction with CSS 2.1 Media Types to target mobile users with a set device size or screen dimension. Using these queries, you can provide optimised CSS style sheets that are tailored to a particular size of device…
csshead 0 Comments