Can anyone help solve this problem

YOu can see here what I want the menu to look like
http://www.bitsmail.co.uk/cloudsend/Index.htm

But why am I getting a shorter block on the house pictures & then longer sections on the sub links????

Here is the html code code

<div class="navlinks">
<div id="content">
<ul id="odo2">
<li class="navlink"><a href="../Index.htm">Home</a></li>
<li class="navlink"> <a href="../Contact.htm" >Contact</a></li>
<li class="navlink"><a href="../Tariff.htm">Tariff</a></li>
<li class="navlink"><a href="../Details.htm">Details</a></li>
<li>House Pictures
<ul class="navlink-sub1">
<li> <a href="../Sleeping.html">Sleeping</a></li>
<li> <a href="../cooking-eating.html">Cooking &amp; Eating </a></li>
<li> <a href="../Living.html">Living &amp; Gardens </a></li>
</ul>
</li>
<li class="navlink"><a href="../floor-plan.html">Floor Plan </a></li>
<li class="navlink"><a href="../Location.htm">Location</a></li>
<li class="navlink"><a href="../Terms-Conditions.htm">Terms &amp; Conditions </a></li>
</ul>
</div>
</div>

Here is the CSS code

/* ************list styles ******************/

.navlinks a{
font-size: 12px;
color: #003300;
text-decoration:none;
padding: 6px 6px 6px 2px;
background-color:#D5DBCB;
font-family:Verdana, Arial, Helvetica, sans-serif;
width:135px;}

#content div { width: 140px; }
#odo2 { font-size: 12px; color: #003300; text-decoration:none; padding:6px 6px 6px 2px;}
#content ul, #content li { margin: 0px; list-style-type: none; font-weight: normal; border:none; }
/* This is the links within ul & li code */
#content li a { margin-left: 0px; text-decoration: none; width: 100%; height: 100%; font-weight: normal; display: block; width:135px}
.navlink a{font-size: 13px; color: #003300; text-decoration:none; padding:6px 6px 6px 12px; background-color:#D5DBCB; width:135px; }
.navlink-sub1 a{ font-size: 13px; color: #003300; text-decoration:none; padding: 6px 6px 6px 16px; background-color:#EDF0E9; width:135px;}
#content li a.samePage { color: #FFFFFF; font-style: italic; font-weight: normal; }

It looks like the CSS is a bit cramped. You could do without any IDs here, or one at the most. You have two containing divs where one will do. If you simplify all of this I think you'll find your problem. This is a case of "too many rules spoils the layout".

tim

My thinking exactly but I seem to remember writting that quite a long time ago & was sat here after I posted thinking I might rewrite the CSS

I will have a go

Get rid of the 6px right padding on #navlinks a and they'll all be the same width.

LOL

Should have known my lady in red guru would have the answer

I hope you are well.

My wee boy is 3 this year - how time flies - I seem to remember last time you helped me out he was just born - gosh time really does fly !

Thanks as ever & I hope the last 3 yaeras have been as kind to you as they have been fun to me

Tonya

You're quite welcome.
I'm doing well, thanks
Time flies waaaaaaaaaay too fast !