Menu
An extremely simple design, yet seemingly completely impossible.
[url]http://www.dootdootdoodydoodydootdoodoooo.com/blam/index.php
Ok. So there’s the container div ( max-width:900px; ). Then the nav list (automaticly self sizing dependent on the length of the string in the largest <li>). Then another div to house two other divs. One set to 60% of its parent div and the other set to 40% of its parent div (I’ll sort the padding and margins later down the line). Only trouble is, the child divs won’t take the percentages of their parent unless the parent has been given a specific width.
As you can see, the child divs are taking 60 and 40 percent of the 900px. As if the parent div didn’t realise that list was there and thought its natural width would be 900px (the max width of the container). This is evidenced by giving #nav {display:none;}. Once the menu is removed, the child divs make a perfect fit.