Tag: liquid
-
Media queries presentation at indieconf
Download the slides for my presentation on CSS3: Using Media Queries to Improve the Web Site Experience for indieconf, as well as get links to related resources on media query techniques, tools, and inspiration.
-
Examples of flexible layouts with CSS3 media queries
Media queries let you to feed different CSS to users based on their viewport size (among other things), allowing you to create even more flexible layouts than ever before. See visual examples of real sites that use CSS3 media queries to make the layout more adaptable to the variety of screen sizes and devices in use today.
-
70+ essential resources for creating liquid and elastic layouts
Check out these great online resources on creating liquid/fluid and elastic layouts, including sources for design inspiration, downloadable templates, frameworks, articles and tutorials.
-
Me at The CSS Summit online conference
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
Check out Nomensa’s portfolio for great examples of liquid site designs.
-
Why browser zoom shouldn’t kill flexible layouts
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
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
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
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.
-
Foreground images that scale with the layout
Simple CSS techniques can make the content images inside your liquid or elastic pages scale with the layout.
Stunning CSS3: A Project-based Guide to the Latest in CSS
Flexible Web Design: Creating Liquid and Elastic Layouts with CSS