2 replies [Last post]
thatboyjim
thatboyjim's picture
Offline
Regular
Last seen: 13 years 38 weeks ago
Joined: 2007-01-25
Posts: 41
Points: 0

Hi guys

I am having a slight problem with border bottom.

http://www.gordonstoker.co.uk

I am basically trying to achive a 3px border hover under each menu item. This works fine in Firefox 2 and I.E. 6, but it doesn't show in I.E.7. Anyone got any ideas why?

CSS

html {min-height: 100%; margin-bottom: 1px;}
body {font-family:Arial, Helvetica, sans-serif;width:100%;margin:0;padding:0;font-size:62.5%;}
p {padding:0 0em 0.2em 0; margin:0em 0 1em 0;font-size:1.3em}
a img { border:none;}
h1,h2,h3,h4,h5 {margin:0; padding:0;}
h1 {font-size:1.8em; margin:0 0 1em 0; font-weight:normal;}
#wrapper {margin:0 auto; width:78.2em; border:1px solid black;overflow:hidden;}
#banner {position:relative; width:78.2em; float:left; }

#navbar {
float:left;
width:78.2em;
height:2.4em;
border-bottom:3px solid black;
text-align:center;
padding-top:0.8em;
}

#navbar ul {
margin:0;
padding:0;
}

#navbar li {
display:inline;
list-style-type:none;
padding:0.5em 0 0.5em 0;
}

#navbar li a {
text-decoration:none;
color:#666666;
border-bottom:3px solid white;
font-size:1.4em;
}

#navbar li a:hover {
border-bottom:3px solid black;
color:black;
}

#content {
float:left;
width:78.2em;
height:20em;
}

Thank you in advance.

James

DanA
DanA's picture
Offline
Elder
Last seen: 11 years 37 weeks ago
Timezone: GMT+2
Joined: 2004-08-14
Posts: 1087
Points: 2

Add position:relative; in

Add position:relative; in #navbar ul

thatboyjim
thatboyjim's picture
Offline
Regular
Last seen: 13 years 38 weeks ago
Joined: 2007-01-25
Posts: 41
Points: 0

Genius, thanks man! James

Genius, thanks man!

James