CSS Challenge

This is a challenge for all you web designers and CSS experts/hackers.

Check out this design:
CSS challenge design

Each panel has a margin between the parent of 10 pixels in each side. The red panels are also spaced by 10 pixels with each other.

The challenge: Create the above design

Rules of engagement

  • You need to create this design using CSS classes only
  • Each panel can be a div or ASP.Net panel control
  • The panel should adjust automatically when the window resizes. The white panel should always cover the browser content.
  • You can not use CSS expressions or JavaScript.
  • No scroll bars are shown.
  • The margins between the panels will always be 10 pixels.

I tried to implement this design, but didn't succeeded to to so by using CSS only.

Take your shoot!

Yossi Shmueli

Technologist, enjoy solving technical challenges for real world applications. Keeping it Green since 1995

comments powered by Disqus