Robyn,
I guess you can go one of two ways:
Create two unordered lists and float them next to each other calling the
one red and the other yellow:
<ul id="red-nav">
<li></li>
<li></li>
</ul>
<ul id="yellow-nav">
<li></li>
<li></li>
</ul>
#red-nav, #red-nav ul {
position:relative;
float:left;
}
#yellow-nav, #yellow-nav ul {
position:relative;
float:left;
}
or, use a class on the li's you want a different color, for example:
<ul>
<li class="red"></li>
<li class="red"></li>
<li class="yellow"></li>
<li class="yellow"></li>
</ul>
This has not been tested so I may be off here, but it makes sense.
HTH
Robyn M. Smith wrote:
> I'm trying to find a way to have a two-color horizontal navigation area:
> for example, a yellow background on the left half and a blue background
> on the right half. I've tried using nested divs to divide a navbar area
> into two regions with their own styling. It works, but, of course, this
> falls apart in older browsers, so I was looking to see if there's a way
> to accomplish it using the unordered list. Then I would have two style
> sheets.
>
> I haven't been successful yet and thought maybe this has already been
> done in CSS somewhere. I saw something similar at designdetector.com,
> but I'm only looking to do two colors. From what I can see of that
> source code, it looks a bit complicated.
>
> Of course, I could create a table, which might be easier, but do I want
> to do that?
>
> Any tips, suggestions, alternatives are greatly welcomed.
>
> Robyn Smith
>
> ______________________________________________________________________
> css-discuss [EMAIL PROTECTED]
> http://www.css-discuss.org/mailman/listinfo/css-d
> IE7 information -- http://css-discuss.incutio.com/?page=IE7
> List wiki/FAQ -- http://css-discuss.incutio.com/
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
>
>
>
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
