- This topic is empty.
-
AuthorPosts
-
June 25, 2008 at 3:50 pm #22829ThinkSoJoEMember
I’m sure I completely missed something in my CSS, but I’ve been working on a new design for my oldest website, and decided that in lieu of creating static link names like I did in my other project I’ve been working on, or no navigation bar like I did with my newest site, boredwrestlingfan.com, I thought I’d try my hand at CSS coding the main links in a navbar at the top of the page, in the header image. While it works fine in Firefox and Opera, in IE it comes up weird – the first link is below where it should be, the next one is higher, and it almost creates a stair-like effect leading to the last link, which is in the position it should be. You can check it out at http://testingground.fropac.com/s5pconcept and see for yourself. Obviously I’m just starting this one, as I haven’t done up the link colors or anything. I’m also eventually going to need ideas about getting IE 6 and below to render the transparency properly in my PNG files because I have no clue how to work around that. Anyways, here’s the code as it is now:
Code:ul#nav {
height: 207px;
width: 696px;
background: url(images/header.png) no-repeat;
margin: -20px auto;
position: relative;
}
ul#nav li a{
display: block;
width: 112px;
float: right;
margin-top: 150px;
margin-left: 5px;
color: #777777;
font-size: 20px;
font-weight: bold;
text-decoration: none;
text-align: center;
}
ul#nav li a:hover, ul#nav li a:active{
color: #fff600;
}Anybody have any idea what I’m doing wrong to cause the stair effect in IE, or at least an idea of a workaround? Again, it only comes up wrong in IE, other browsers I’ve tested work fine.
June 25, 2008 at 4:04 pm #48132Historical Forums UserParticipantIt’s step-down your experiencing.
Chris has a good article on it:
June 25, 2008 at 7:38 pm #48136ThinkSoJoEMemberthat absolutely worked. I knew I should’ve looked around the site before posting here, but I was just too out of it at the time. Thanks for the help!
-
AuthorPosts
- The forum ‘CSS’ is closed to new topics and replies.