Forums

dmbutler

Hi All,

How is everyone? Thanks for your help with my personal site, I am now implementing some of the changes and will get a new version online soon.

I have another little problem, I am working on the structure of a site which has the menu to be situated at the base of the header on the right hand side, however I can't get it to sit where it's supposed too. The only browser it works in is Opera. In FF and Safari, the menu drops too low and doesn't sit on the base of the header.

Would anyone know what I'm doing wrong? :? Many thanks for your assistance yet again.

Best wishes,

Darrell.

A link to the structure is: http://www.kscope.co.uk/upload/files/index.html

This is the HTML

<div id=\"header\">
    <div id=\"menu\">
      <ul>
        <li><a href=\"#\">welcome</a></li>
        <li><a href=\"#\">the law</a></li>
        <li><a href=\"#\">the service</a></li>
        <li><a href=\"#\">the people</a></li>
        <li><a href=\"#\">contact</a></li>
      </ul>
    </div>
  </div>

This is the CSS

#menu {
	float: right;
	padding-top: 126px;
	width: 487px;
}

#menu ul {
	margin: 0px;
	list-style: none;
	padding: 0px;
}

#menu li {
	display: inline;
}

#menu a {
	float: left;
	padding: 5px 15px;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 12px;
	display: block;
	color: #FFFFFF;
}

#menu a:hover, .active a {
	color: #000000;
	background: #FFCC00;
}

Ninja Clone

Well, if you give 125px top-padding to div menu, you should expect if to fall down :)

dmbutler

I take it this isn't the correct way to position my menu then? How confusing!! :oops:

al_m473

attached is an image of how it appears on my screen in IE7 and in FF2, if this not how it should appear,
then how should it show up?

[attachment=0]menu.JPG[/attachment]

dmbutler

Ah yes, it looks OK in that state, but when you hover the mouse, the boxes drop below the yellow line which isn't how I intended. I would like them to sit just neatly on the yellow line. I'm sure this is probably quite straight forwards, however I don't seem to be able to get this right! Oh dear.

TheDoc

Hover working fine for me in FF3 and IE7. Where are you seeing the problem?

dmbutler

Er, how embarrassing. :oops: I have double checked the file in FF3 (which yesterday i wasn't working) and Safari (again, it wasn't working) and it now appears to be working as I intended!

That I certainly don't understand - I'm going to need to take this away and look closer to see what was happening. :?: Thank you all so much for your assistance. :)

treehouse : what would you like to learn today?

Forums

Menu Positioning