Live-action CSS (I finally grok CSS bookmarklet)
And from my cube comes a mighty Duh. I never before realized this:
Using an appropriate browser bookmarklet, you can observe the effect of CSS style definition changes rendered in real time.
At least with this tool combo —
- Mac OS X 10.2.6
- Mozilla 1.4
- Jesse Ruderman’s “edit styles” bookmarklet as provided by Simon Willison, Using bookmarklets to experiment with CSS
— a click of the “edit styles” bookmarklet in a browser window opens another window containing a copy of the open page’s governing stylesheet. Make style definition changes to that open stylesheet text and you see the changes rendered live in the browser window. When satisfied with the result, copy-and-paste the modified stylesheet text into the real stylesheet file.
I can’t believe I’ve let this bit of designing efficiency sit under my nose all this time. If this bookmarklet works in IE, too, this should really cut down the number of CSS tweak iterations needed to accommodate IE/Win’s CSS borkage.
I’m always glad when radical coolness rears its lovely head, even when I’ve been really slow to recognize it.
Thanks, Simon and Jesse.