Google Chrome Developer Tools: Styles Tip
Nov 13, 2009 Articles
If any of you have been using Google Chrome instead of Firebug for your web development, you might have found yourself in a pinch. When using FireBug, it is relatively easy to add additional CSS styles to an element or its styles on the fly. Chrome doesn’t seem to have that ability out of the box.
Well, there IS a way, although it is rather hacky. That doesn’t mean it doesn’t do the trick!
Lets say you have an inline element with the following styles
However, you suddenly realise that in order to apply a width to an element it has to be a block element. So, instead of changing your stylesheet and refreshing the page, type:
Press Enter, and the additional style gets added!
Quite simple, but annoying if you didn’t know about it. Hope this helps anyone out there using Chrome for their development.
Tags: chrome, CSS, developer, firebug, Google, HTML, style, styles, stylesheet, tools, xhtml
