Skip to content

Pilmore, Lee

CSS Frames v2, full-height

Filed under CSS, Design on September 6th, 2006 |

Roger Johansson gives us a great demo / tutorial on creating a frame effect using CSS. This is particularly timely as I have been considering this technique for an up-coming project at Jadu.

“I’ve prepared two example documents to show the difference. In Example 1, the layout is fully fluid, so #header and #footer are 100 % wide. In Example 2 the layout is 40 ems wide, and the widths of both #header and #footer are set to that same value.” - Roger

Both examples also demonstrate elastic layout as well as graceful degradation. As maybe expected there are comments regarding IE6 but I think it’s still pretty safe.

Leave a Comment

Required

Required, but not displayed

Some HTML allowed: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Picture house

Coming from Flickr

Diversions