2009/3/6 Robert Turner <[email protected]>
> The other options is to use a two column layout with float: left and
> float: right, but these need to have set widths. eg.
>
> .left-nav {
> float: left;
> width: 19%; /* or Xpx */
> }
>
> .content {
> float: right;
> width: 80%; /* or Xpx */
> }
>
> We use this approach on our site: http://flexa.com.au
>
>
The set widths aren't a problem. The floats are, however. What you are
suggesting above is all very well when you have two independant elements
that sit side-by-side such as:
<ul class="left-nav">
<li>item1</li>
<li>item2</li>
<li>item3</li>
</ul>
<div class="content">
stuff
</div>
When you have nested elements, however, the inner elements floats off to the
appropriate side alright but sits underneath the content of its parent. So
what you end up with is something like:
Main Navigation
- Page 1
- Page 2
- Page 3
Subscriber Modules
- Module 1
- Module 2
- Module 3
- Module 4
Because of the variability of the length of the lists, I'm reluctant to use
a negative margin to bring the Subscriber Modules list up level with the
Main Navigation list - All it would need is for an extra page to be added to
Main Navigation and the layout is thrown out again.
Thanks for the suggestions though. :)
Cheers,
Seona.
*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [email protected]
*******************************************************************
