Ian-
Disregard my private email to you. I sent it by accident before fully
realizing the problem. The information below will sort you out.
Ian wrote:
> I'm getting in a knot over list items. I am using one for a
> horizontal menu and that is working fine. However, I want also to
> have a regular unordered list on one of my pages and it is
> not working.
>
<SNIP>
> However, on the page the list items seem to be displaying inline and
> with borders top and bottom - i.e. like the menu list items. I tried
> enclosing the menu buttons in a <div> and then defining the menu
> button styles like this:
>
> #mainNav ul {
> ...
> }
>
> but it seems to make no difference. In all, it is not working. You
> can see the page where it is all going wrong here: http://
> www.tellura.co.uk/tsc/strategy.htm.
>
> Any guidance much appreciated.
>
> Ian
Ian-
Your problem is specificity and the fact that you're not applying the ID
to the top horizontal div as you think you are.
Your structure currently looks like:
<div id="mainNavigation">
<ul id="mainNav">
<li class="home"><a href="index.htm">Home</a></li>
<li class="strategy"><a href="strategy.htm">Strategy</a></li>
<li class="materials"><a href="materials.htm">Materials</a></li>
<li class="surfaces"><a href="surfaces.htm">Surfaces</a></li>
<li class="manufacturing"><a
href="manufacturing.htm">Manufacturing</a></li>
<li class="partners"><a href="partners.htm">Partners</a></li>
</ul>
</div>
Your css is written like:
#mainNavigation {
}
ul {
border-top: 1px solid #000000;
border-bottom: 1px solid #000000;
margin: 5px 10px 20px 10px;
padding: 5px 0;
list-style: none;
display: inline;
float: left;
width: 740px;
}
etc.
You are feeding absolutely no rules specifically to the unordered list
in the mainNavigation div.
You have two choices. You can rewrite your css specific to the DIV ID,
or specific to the UL ID.
DIV ID would be like:
#mainNavigation ul {
border-top: 1px solid #000000;
border-bottom: 1px solid #000000;
margin: 5px 10px 20px 10px;
padding: 5px 0;
list-style: none;
display: inline;
float: left;
width: 740px;
}
UL ID would be like:
ul#mainNav {
etc.
}
You then will have no need to override the horizontal nav rules for any
other unordered list. You can simply apply whatever rules you want to
the generic UL.
Regards,
Ron
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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/
