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

Filed under: Internet, Utilities, Web services, Design Tips

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

by David Chartier Mar 22nd 2007

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.

Reader Comments (Page 1 of 1)

Megan Taylor said 8:30PM on 3-22-2007

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

Thomas said 9:43PM on 3-22-2007

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

no_link said 9:51PM on 3-22-2007

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

Kunal said 10:52PM on 3-22-2007

#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. :)

Nick O'Neill said 10:56PM on 3-22-2007

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.

kingkool68 said 1:28PM on 3-23-2007

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/

Featured Time Waster

Civiballs is a beautiful, soothing physics puzzle Time Waster

I have an absolute weakness for physics games, and while Civiballs isn't the strongest physics-based game, what it lacks in the physics department it makes up for a few times over in style and fun.

In Civiballs, you are presented with a few colored balls, and your goal is to get those balls into the same-colored urn on the level. The "civi" part of Civiballs is that there are 3 sets of levels to play, each representing a different civilization. While the civilization doesn't affect gameplay, the artwork for each level is beautifully themed to it's appropriate era.

To play the game, you are given only one tool - a sword with which to cut the chains that are holding the balls. The puzzle part of the game is in figuring out what order, and with what timing to cut each chain. Do it right, and all the right balls end up in the right urns, with no stray balls entering an urn (a no-no). Do it wrong, and you get to start over again.

Civiballs is not terribly deep on gameplay; the entire game can be completed in about 15 minutes. But if you enjoy this type of game, it will be a very enjoyable 15 minutes.

View more Time Wasters