Posts Tagged: CSS

70+ essential resources for creating liquid and elastic layouts

Posted January 25th, 2010 by Zoe Gillenwater & filed under Articles.

Check out these great online resources on creating liquid/fluid and elastic layouts, including sources for design inspiration, downloadable templates, frameworks, articles and tutorials.

Roundup of Font Embedding and Replacement Techniques

Posted September 17th, 2009 by Zoe Gillenwater & filed under Articles.

There are more options than ever for getting unique, good-lookin’ fonts into your pages. Apart from @font-face, here are your options for font embedding services and font replacement techniques.

Me at The CSS Summit online conference

Posted July 18th, 2009 by Zoe Gillenwater & filed under Announcements.

Download the slides from my presentation at The CSS Summit online conference, as well as get links to related tutorials on designing flexible images.

The liquid web site motherload

Posted July 16th, 2009 by Zoe Gillenwater & filed under Articles, Inspiration.

Check out Nomensa’s portfolio for great examples of liquid site designs.

CSS effect: space images out to match text height

Posted June 30th, 2009 by Zoe Gillenwater & filed under Tutorials.

Make several fixed-width images change their spacing to stay lined up with accompanying text, no matter the window size or text size.

Nicole Sullivan speaking about OOCSS at the CSS Summit

Posted June 22nd, 2009 by Zoe Gillenwater & filed under Announcements.

Learn about Object Oriented CSS from Nicole Sullivan at The CSS Summit online conference, July 18, 2009.

Why browser zoom shouldn’t kill flexible layouts

Posted June 16th, 2009 by Zoe Gillenwater & filed under Articles.

All the major browsers now have zoom functions built in, which may make it seem like there’s no longer any need for liquid or elastic layouts. Not so.

Voices That Matter: Web Design Conference 2009

Posted April 28th, 2009 by Zoe Gillenwater & filed under Announcements.

Download the slides from my presentation at Voices That Matter: Web Design Conference 2009, as well as get links to related tutorials on designing flexible images.

Creating sliding composite images

Posted April 27th, 2009 by Zoe Gillenwater & filed under Tutorials.

Create the appearance of a single image by layering multiple images on top of each other. The pieces can slide around the page as its width is changed, making it a perfect technique for liquid layouts.

Hiding and revealing portions of images

Posted April 25th, 2009 by Zoe Gillenwater & filed under Tutorials.

It’s possible to dynamically “crop” both background and foreground images as the layout changes in width, solving the problem of overflowing fixed-width images in a flexible page.

View more posts: