I’m using chrome for development and I’ve discovered this cool features.
Using the Chrome Developer Tools you can inspect css properties and change on the fly the values.
Try it on CSS garden, download this two files: html file and css file, and play with them.
Inspect some elements and change the css properties:
Here are the changes:
Like it? Click on the css name on the right
Chrome will go to the Resources Pages…
Right Click and… choose SAVE, the first time it will ask you the position of the local CSS file…
Next time the SAVE option will save the file silently without popups.
This trick is useful if you use external css files, it doesn’t work on server pages with hard coded css.
Here is the link to the Google IO 2011 presentation of this functionality: http://youtu.be/N8SS-rUEZPg, the first section of the video shows the CSS edit improvements in Chrome developer tools.
The State – Sort of – of HTML5 Audio
5 years ago