<pedrocorreia.net ⁄>
 

<Find computed styles in IE, Firefox, Opera or Safari ⁄ >




clicks: 3175 3175 2008-05-06 2008-05-06 goto misc myNews misc  Bookmark This Bookmark This


At my recent Web 2.0 Expo talk, I exhorted developers to get comfortable outside the Firebug/Firefox safety zone. By rotating between Opera, Safari and even IE as our primary development environments, we can really get to know those browsers - and perhaps learn to utilize their non-standard features. Switching things up, however, can inhibit productivity until you learn your way around each browser's tools.

To that end, I offer these step-by-step instructions for finding computed styles in all four A-grade browsers. I chose the display of computed styles as my "debuggers are cool" use case because it's an obscure but useful feature for CSS debugging. Most of the time I can debug styles by looking at my debugger's snapshot of the current cascade for a given element. But sometimes that's not enough. If I've assigned a value of "inherit" to the font-family of an element, then the cascade snapshot won't tell me what font is actually applied to that element. (Not being a designer, I often can't tell the difference between various sans-serif faces, especially at small sizes.) Luckily, computed styles can give me the information I need.

As these examples demonstrate, debugging tools have come a long way in the last couple of years. Let's make the most of them for all of our UI-layer needs.



este é só um excerto do artigo, para aceder ao artigo completo, clique no link em baixo:
this is just a small excerpt from the article, to access the full article please click in the link below:

http://blogs.pathf.com/agileajax/2008/05/developers-note.html




Subscribe News RSS  Subscribe News Updates by E-mail





myNews <myNews show="rand" cat="misc" ⁄>

Adobe Photoshop CS6: Improvements for Web and UI Designers new ...

Photoshop CS6 has been hailed as a huge improvement for web and UI designers. I'm going to share wit (...)

clicks: 16575 16575 2012-05-14 2012-05-14 goto url (new window) webdesign.tutsp... goto myNews misc


Camera Exposure Modes Explained new ...

If you're just getting started with photography, the letters on your camera's dial might feel like h (...)

clicks: 14563 14563 2012-05-13 2012-05-13 goto url (new window) photo.tutsplus.... goto myNews misc


45 Fresh Collection of High Quality Free PSD Files new ...

What else can be so great for a designer than finding out high quality Photoshop PSD files? This is (...)

clicks: 8968 8968 2012-05-09 2012-05-09 goto url (new window) smashingapps.co... goto myNews misc


15 Free High Quality ToolTip PSD's new ...

A tooltip or infotip can be defined as a graphical hint that is incorporated with the website design (...)

clicks: 10540 10540 2012-05-07 2012-05-07 goto url (new window) smashingapps.co... goto myNews misc


40+ Elegant Examples of River Photography

River photography is one of the beautiful type of photography, photographers take pleasure in this w (...)

clicks: 6417 6417 2012-05-04 2012-05-04 goto url (new window) smashingbuzz.co... goto myNews misc


40 Fresh And High Quality Free Icon Sets In PSD Format

Here is yet another exciting collection of high quality Free Icon PSD files for the designers that t (...)

clicks: 7037 7037 2012-02-19 2012-02-19 goto url (new window) smashingapps.co... goto myNews misc


15 jQuery Calendar Date Picker Plugins

In this collection, you will see some of the best jQuery Calendar Date Picker Plugins that will allo (...)

clicks: 6940 6940 2012-02-18 2012-02-18 goto url (new window) smashingapps.co... goto myNews misc


50 Beautiful Yet Free HTML5 And CSS3 Templates

HTML5 templates are getting very popular these days because all professional HTML5 templates are com (...)

clicks: 7492 7492 2012-02-17 2012-02-17 goto url (new window) smashingapps.co... goto myNews misc