Ron,
Thanks very much for helping me with this. Your advice worked nicely!
Regards,
Ian.
--
Dr Ian M Piper
[EMAIL PROTECTED]
skype: ianmpiper
--
Where is the wisdom we have lost in knowledge?
Where is the knowledge we have lost in information?
On 15 Mar 2006, at 7:58 pm, Pringle, Ron wrote:
> 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/
______________________________________________________________________
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/
