The Hickensian
5.02.04 Edit CSS in Firefox
30 commentsQuick tip if you haven’t come across this before. There is an excellent web development extension available for Firefox called Edit CSS. Quite simply, it allows you to view all style sheets for the current page in the sidebar, make edits and see the result as you type. The amount of time this saves is amazing.
A problem with many firefox extensions is that they break in current and mac builds, and this is the case here. The useful option to save the css once edited doesn’t work. Even with this bug, its a worthwhile download.
Update 11.02.04: All thats needed to make Edit CSS work fully, is the jslib extension. Now I can save edited styles, or load new ones. Thanks to John for pointing this out.
Perfect for deciding on that new colour scheme… ;o)
Recent Posts
19.03.10 New Tardis Interior in Series 5
16.03.10 Why the big rush Mr Mandelson?
17.02.10 A new global visual language for the BBC's digital services
17.02.10 Moving on
11.02.10 Zootool
Or Full Archives
The Hickensian is the journal of Jon Hicks, one half of the creative partnership Hicksdesign. Read more about us.
Journal RSS Feed
Find me on:
playlist
Elsewhere
Comments | RSS
∞ Lars said 2237 days ago:
Yuck.I absolutely agree on the usefulness of the extension though. Someone should do just as nice an overview of, say, the 10 most useful Firebird extensions.
Hint, hint... :)
∞ Jai said 2237 days ago:
I use this extention quite a bit. Sometimes I even use it when I'm bored to make sites look different. I found it seems to have issues with floats and things, but for genral color stuff it's fantastic. But um... Jon... that example you put up there with the pink and yellow Hicks design... um, I know you're color bliond and all but... please don't make that your site design!∞ Jon Hicks said 2237 days ago:
c'mon people - you know I'm joking surely?∞ Jai said 2237 days ago:
:) surely! Like an organist at a church service :P... swing low, sweet chariooooot...∞ Jayme said 2237 days ago:
Jon, what theme are you using for Firebird, and where did you find it? Just curious. It's nice and Safari looking.∞ Jon Hicks said 2237 days ago:
Jayme - if you download a recent nightly build, its the default theme! Sweet isn't it? It makes such a big difference.I think the latest is at:
http://ftp.mozilla.org/pub/mozilla.org/firebird/nightly/2004-02-04-02-trunk/Firebird-mac.dmg.gz
Version 0.8 is due for release on Monday, and the theme will be 'official' in that.
∞ Carlo Zottmann said 2237 days ago:
Jon, try the excellent bookmarklets @ squarefree.com:http://www.squarefree.com/bookmarklets/webdevel.html
Nothing to install, won't break your browser, more flavas. ;) Make sure to check "edit styles" and especially "shell".
You'll love it.
Carlo
∞ Jon Hicks said 2237 days ago:
Sure, I use a lot of these - what I loved about the extension was the way it worked within the browser.Shame they don't work in Safari (that's Apple's fault, not Jesse's!).
∞ Scott Johnson said 2237 days ago:
Wow! I'll be installing this tonight! Now if only we could get something like this for (ick!) IE...that would prevent plenty of migraines.∞ Matthew Welle said 2236 days ago:
Is it bad that I'm almost looking forward to Monday, just because of Firebird 0.8?Someone needs a bit of R&R!
∞ Carlo Zottmann said 2236 days ago:
No, that's understandable and I can totally relate to it, Matthew. ;)∞ Jon Hicks said 2236 days ago:
Mondays release is going to be a bit different too. Watch this space...∞ Matthew Welle said 2236 days ago:
Oh cmon, that's not fair :)∞ Jon Hicks said 2236 days ago:
Its only a couple of days...∞ Lars said 2235 days ago:
But you can tell us, Jon. We are your friends. You know you want to. We won't tell anyone...∞ Jon HIcks said 2234 days ago:
Lars - I like the idea of the 10 best extensions. What we'd have to first is find 10 that work in both PC and Mac.The web developer extension would have to be on the list too:
http://chrispederick.myacen.com/work/firebird/webdeveloper/
∞ Chris Neale said 2233 days ago:
Firefox ?any mention of my extensions, or those I've been associated with ?
∞ Lars said 2233 days ago:
I wouldn't mind contributing a short write-up (with screenshots, if necessary) for one or two extensions, should you or anyone else have such plans. Perhaps someone else could chip in too?I'm using Compact Menu, mozCalc, Style Selector, Tabbrowser Extensions (I think there are two tabbrowser extensions available, the one I'm using is by a Japanese guy).
I haven't checked Mac compatibility for any of these (server seems down at the moment), but I agree it would be nice if all ten worked cross-platform.
∞ Lars said 2233 days ago:
I forgot Checky.∞ Colly said 2233 days ago:
CSS edit is working wonderfully with Firefox so far. I'm not yet sure how much of my time it will give back to me, but it's looking good. Thanks Hicks...∞ John said 2231 days ago:
Note that if you install the jslib extension, it adds the support needed for the load and save buttons in this extension. (No idea if that works on the Mac or not.)∞ Jon HIcks said 2231 days ago:
John - thanks so much! It does indeed work on OS X! I'll have to update the entry...∞ dojob said 2230 days ago:
well, everytime i try to install one of these on my Mac, Firefox crashes on me :^(∞ Jon Hicks said 2230 days ago:
Thats the problem I've had with most, but Edit CSS should be OK.∞ dojob said 2229 days ago:
ok, the latest nightly build solved the problem, thanks a lot for the hintyou did a great job in skedit and firefox's icon is just great
∞ Erkki said 2229 days ago:
Hi Jon & thanx for your amazing work :-)About Firefox extension installation on Mac os X 10.2.8:
As many users it was obviously not possible to install any extension from Firefox (assuming it's a fresh install not an update from Firebird 0.7), result would be crash after crash after crash... In a single word: outrageous!
Then after looking for a solution for this problem and checking Firefox forums, I found the following in order to have (Firefox compliant) extensions to work in the official Firefox release:
1- Delete Firefox (including Mozilla Folder in ~/Library/Mozilla and Phoenix Folder in /Users/your_name/Library/Phoenix).
2- Download the latest nightly build (Firebird icon and version is Firefox 0.8.0+). Find it here: http://ftp.mozilla.org/pub/mozilla.org/firefox/nightly/latest-trunk/
3- Install, dowload the extensions you need from here: http://extensionroom.mozdev.org/main.php
(or http://texturize.net if you succeed...)
4-Restart Firefox (version 0.8.0+) and disable all the extensions from the extensions pref panel).
5-Download and install the official Firefox release. Go to the extension panel and enable extensions.)
6- Enjoy Firefox with EditCSS or Web Developer extensions as you did with Firebird :-)
Hope this can be useful. (at least dojob might try that)
Btw, it's basically the same instructions as found on Firefox pages for updating from Firebird. I don't know if it works, I thought it was better to reinstall from the scratch but it wasn't!
∞ Jon Hicks said 2229 days ago:
I'm sorry you've had all that hassle. I had the extension installed before I upgraded to FireFox 0.8, although I had been using with the nightly builds.∞ Cleay said 2215 days ago:
Just downloaded firefox and editcss - sounded like a great tool - but firefox is refusing to display some bg images for a site I'm working on (using editcss or otherwise), I had a good search but couldn't find anything on it. Maybe it's me being stupid (it is kinda late here in NZ!), but it works fine in macIE and safari so far:http://www.flashfarm.co.nz/aura/index.html
anyone had any similar experiences, or insight?
Shame, it'd be nice not to have to switch between bbedit and safari a thousand times a day!
∞ Jon Hicks said 2215 days ago:
Cleay - do you not use BBEdits new preview feature? It uses the safari rendering engine...∞ Cleay said 2215 days ago:
No actually I haven't used that John - I'll check it out. I'm still kinda new to the whole css thing, so still streamlining the process. Funny how you can miss some of the workflow features in version updates - I probably still have some outdated methods from ps3 too!I figured out my problem btw - It was late and I was stupid! - seems I tacked a few extra values on the end of a couple of background-image properties and forgot to remove the '-image'.
Safari doesn't mind - firefox does (I'm sure PCIE does too!)...