skip to main content

Simply Practical CSS

All links open in the same window

CSS Challenge

On March 6 (2005), Al Sparber from ProjectSeven posted a " CSS challenge" on different lists and newsgroups. This challenge was about duplicating a specific page without using a table.

Other requirements follow:

  • Valid XHTML 1 Strict
  • Valid CSS 2
  • Section 508 compliant
  • WAI Level AAA
  • Three columns, fluid center column [increase or decrease width by 100px]
  • Column backgrounds extend to height of tallest column [make the Left | Middle | Right column the tallest]
  • Identical Masthead
  • Source code ordering same as this page [Linearize]
  • Have a minimum layout width of 750 pixels and stand up to window resizing without breaking [Try a different width: 600px | 1000px]
  • CSS embedded in document head [view source]
  • In the sidebar is the list of browsers that must be supported (this is a list of browsers in which this layout has been successfully tested)

Read about the technique used here...

Please use this contact form to send feedback and report errors.

Layout must work in:

  • FireFox
  • Opera 7.54
  • MSIE 6
  • MSIE 5 Windows
  • MSIE 5 Mac
  • Safari

Creative Commons License