Live CSS Edit with Textmate & Firefox

Question

I have become accustom to editing CSS live in the browser using FF dev toolbar. However I do miss Textmate and syntax highlighting. I'm looking for a plug-in for Textmate to edit CSS live while viewing in Firefox. I have tried other editors such as CSS Edit, Espresso, Coda but none live up to the power and flexibility of Textmate.

Ideally the best scenario would be Firefox with a Live CSS panel on the right (Textmate goodness) and Firebug on the bottom. I have staging environments but it's to slow to refresh/reload every time for changes.

Answer 1

The best way I have found to work with TextMate, CSS and Firefox is to use the "ReloadEvery" add-on for Firefox (as long as you're working locally of course) and set it to refresh every second or so.

Then mark the option in TextMate to save when loosing focus OR simply Cmd+S and the changes should be 'next to' instant in Firefox.

Not ideal I know, but kinda works.

I think there is also a TextMate plugin that would allow this but it uses the WebKit rendering engine, not Gecko.

Hope this helps.

Jannis

Answer 2

Check this gem: http://xrefresh.binaryage.com/

Answer 3

Try Playground at http://owyheesoftware.com/playground. It reloads every time you save the file you're working on.