background preloader

Css

Facebook Twitter

Exam

A pixel is not a pixel is not a pixel. Page last changed today Yesterday John Gruber wrote about the upped pixel density in the upcoming iPhone (960x640 instead of 480x320), and why Apple did this. He also wondered what the consequences for web developers would be. Now I happen to be deeply engaged in cross-browser research of widths and heights on mobile phones, and can state with reasonable certainty that in 99% of the cases these changes will not impact web developers at all.

The remaining 1% could be much more tricky, but I expect Apple to cater to this problem by inserting an intermediate layer of pixels. (Later John pointed out that such a layer already exists on Android.) One caveat before we start: because they’re unimportant to web developers I have mostly ignored the formal screen sizes, and I’m not really into disucssing the ins and outs of displays, pixel densities, and other complicated concepts. I do know what web developers are interested in, however. It’s easiest to explain when we consider zooming. Stay tuned. Style Master CSS Editor for Windows and Mac OS X. Cool Tools and Toys for Web Developers John, the lead developer (ok, pretty much the only developer) of Style Master is an avowed hacker. He loves exploring and experimenting with the latest features in browsers. Here's a collection of tools for web developers he's put together to help you analyse and debug your sites (and other people's sites as well), play with CSS3 features (bleeding edge browsers recommended) and more.

XRAY works in Safari, Firefox and Internet Explorer. It helps you visualize the layout of your page. Add it to your bookmarks, and then on any web page, use it to see the position, margins, padding, dimensions and more details of any element. Try it now. XRAY uses lots of cool CSS3 features like border-radius, opacity, box and text shadow, as well as the HTML5 canvas. MRI helps you create the best possible selectors for your CSS.

MRI also uses lots of cool CSS3 features like border-radius, opacity, box and text shadow, as well as the HTML5 canvas. CSS3 Sandbox Gradients. 24 ways. Spiffy Corners - Making anti-aliased rounded corners with CSS.