Hot on HuffPost Tech:

See More Stories

Engadget for the iPhone: download the app now

AOL Tech

AOL
MAIL

Switched

Desktop:
Windows
OS X
Linux

Design Tip: CSSFly lets you edit live site design in your browser

by David Chartier on March 22, 2007 at 07:30 PM

If you're a CSS-slinging web designer who often peers into how other sites are designed, why not take it a step further and actually redesign them, live, in your browser? CSSFly is a tool that seems almost too good to be true: the service allows you to open a site in a frame, with another frame containing the site's markup allowing you to dig in. You get your choice of how and where the frames open, i.e. - markup on the top, bottom, left or right, but unfortunately the markup isn't colorized in any way to help shuffle through the code. Still, CSSFly is a handy way to tinker with virtually any CSS-driven site without having to get out the big guns or ask the site owner for an FTP login.

Tags: designtips

Comments

Megan TaylorMar 22nd 2007 8:30PM

Neutral

CSSVista lets you edit CSS live with a split browser for Fireox and IE.

Dislike

Report

Nick O'NeillMar 22nd 2007 10:56PM

Neutral

This isn't bad, but the Firefox developer toolbar offers the same functionality and some. You can even edit html on the fly. I use it at work, and highly recommend it.

Dislike

Report

ThomasMar 22nd 2007 9:43PM

Neutral

This is extremely cool and works on Mac and PC. Thanks for sharing!

Dislike

Report

no_linkMar 22nd 2007 9:51PM

Neutral

How is this better or different then the web developer toolbar for firefox? You can edit CSS, HTML , and place windows wherever you want

Dislike

Report

KunalMar 22nd 2007 10:52PM

Neutral

#3, I use the Web Dev Toolbar for Firefox too, and it's a great add-on.

The difference seems to be that CSSFly is not a browser add-on, so you can use it within any browser, even on a public computer, to play with a site's stylesheet. I'm not sure if I'd ever want to do that, but the option is there now. :)

Dislike

Report

kingkool68Mar 23rd 2007 1:28PM

Neutral

Come on the best tool out there for web development is Firebug, hands down. You can select a specific piece of HTML code and see all of the styles that are applied to that code and even styles that are overridden as indicated by a strikethrough. Check it out at http://www.getfirebug.com/

Dislike