Live-Preview Your CSS in Firefox and IE6 with CSS Vista

Live-Preview Your CSS in Firefox and IE6 with CSS Vista

February 29, 2008 ( 4 )

It’s been out for a couple years, but today I finally tested CSS Vista, a lightweight app that allows simultaneous live-preview of CSS in both Firefox and IE6, a nice alternative to running three separate applications.

autofill

CSS Vista does require installation of the .NET framework, but is otherwise simple to set up and painless to use. The only real options are to switch from pane-view to tab-view. The lack of features is actually refreshing.

As Firefox users already know, you can hit CTRL+SHIFT+E to live-preview CSS in the browser window. Many have also tried the IE Tab extension, which tends to crash, or have paid for Browsercam service, which gets progressively less useful as browser standards begin to shape up and support is dropping for outdated browsers. With major changes in order for IE8, I’d be interested to see what happens to paid services which rely on crummy browser standards for income (not that there’s anything wrong with that).

One thing you’ll note about CSS Vista is the narrow CSS pane on the left side. This doesn’t really work if you prefer all your CSS declarations on one horizontal line. I’d also wish for more browser options (IE7 and Safari), but as the creators say, CSS Vista remains in its early stages.

For my uses, CSS Vista comes in handy for last-phase cleanup — correcting minor padding and margin quirks. For building CSS from the ground up, I still prefer Dreamweaver for the speedy auto-fill options:

autofill

And if I used a Mac, the decision would be simple: Coda.

The ultimate goal? Write smart stylesheets that work consistently in all browsers — easier said than done, but it can be done. Organize your styles, recycle your classes, do more with less.

Popularity: 2% [?]

4 Responses
  1. karl said:

    darren, good that you brong up the topic

    I just tried cssvista and it went into an infinite loop on two of my sites during css download (had to kill the process). I just wonder why you did not mention firebug in your shortlist, I know it is FF only, but this is a really indispensible tool for me, and I discovered it quite late in my css learning curve, could have saved me some sleepless nights..–)))

    waiting for your mimbo pro release, you have a big fan of here!

  2. Darren said:

    I do like Firebug, but with it too, I only use it for small last-minute fixes. I do use the FF Developer Toolbar quite a bit.

  3. ~zeus~ said:

    “do more with less”; never in my life did i use Dreamweaver of PowerPoint, just Notepad for all my designs :P
    my uncle keeps telling me that im digging a big hole using a spoon while theres a big bulldozer standing right next to me.. but i like it that way :P

  4. I personally never use dreamweaver!

    For final touches I do use Firebug but for fixes for IE I dont really have a tool of use..

Leave a Reply