cssvault - inspiring creativity

After being out of commission for a while, CSS Vault is finally alive and kicking!

If you are always having a difficult time scanning through lines upon lines of CSS code trying to locate the correct selector, try out this idea by Steve Smith: Single Line CSS.

Try comparing this:

#wrapper {
    width:800px;
    margin:0 auto;
}

#header {
    height:100px;
    position:relative;
}

#feature .post {
    width:490px;
    float:left;
}

#feature .link {
    width:195px;
    display:inline;
    margin:0 10px 0 0;
    float:right;
}

#footer {
    clear:both;
    font-size:93%;
    float:none;
}

To this:

#wrapper            {width:800px; margin:0 auto;}
#header             {height:100px; position:relative;}
#feature .post      {width:490px; float:left;}
#feature .link      {width:195px; display:inline; margin:0 10px 0 0; float:right;}
#footer             {clear:both; font-size:93%; float:none;}

Of course, there’s always the option of using an IDE to edit your CSS files and get to style your markup as much as you want.

Link to article

Very cool web-based tool that formats and optimizes CSS markup. Based on CSSTidy.

Code Beautifier: CSS Formatter and Optimiser

The CSS Remix website has been hacked by somebody calling himself “BEYRUT-KaI3uS”. Click on screenshot below for full image.

Tim Gaunt of TheSiteDirector tells his horror story about how his carefully and lovingly-crafted CSS got “fixed” by Microsoft’s Expression IDE.

“… I noticed that my nice, neat and tidy CSS file of around 190 lines was suddenly closer to 300…”

Microsoft Expression Web and CSS -is it all it’s cracked up to be?

Handy article from Inspiration Bit that contains a list of “web-safe” fonts and designer fonts. My personal favorites would be Myriad and Futura. Futura isn’t on the list though. What are your favorite fonts?

16 Best-Loved Font Bits In Web Design

A few days ago I wrote about the new CNN.com design. Head over to Design View for a good take on why the new design “just works” ™.

Design View / Andy Rutledge - quiet structure

Estelle Weyl discusses CSS3 Support in Safari 3.0, briefly covering the new features of CSS3 such as multiple backgrounds, rounded corners, and selectors. Also provided is a table showing which features are supported or not supported in iPhone and WinXP. No OSX though?

Now the only question is: How long until CSS3 becomes the standard?

Safari 3.0 CSS Support » CSS, JavaScript and XHTML Explained

Rob Larsen of DrunkenFist.com has a short but sweet write up on implementing opacity across different browsers using just a few lines of CSS.

Cross Browser Opacity using CSS and Internet Explorer filters

In the heat of iPhone’s launch I landed on another one of those Mac vs Windows-inspired videos. This time around it’s the Opera Mini vs the iPhone, and although it should properly be dubbed Opera Mini vs Safari Mobile, it’s still fun to watch.

Edit: Layout getting messed up because of Youtube’s embed tags getting “auto-corrected” has now been fixed. Thanks, Antonette!