My <li>
wont turn into a link for some reason here is my html and css
Hope some one can help.
<div class="header_quick_link">
<ul>
<li style="padding-left:700px;"><a href="#"><img src="images/signup-off.png" height="26px" alt="sign-up off"/></a></li>
<li style="padding-开发者_StackOverflow中文版left:798px;"><a href="#"><img src="images/login-off.png" height="26px" alt="sign-up off"/></a></li>
</ul>
</div>
.header_quick_link{
left: 0px;
right: 0px;
top: 0px;
height: 26px;
position: absolute;
background: url(../images/quicklink.png);
background-repeat: repeat-x;
z-index: -1;
}
.header_quick_link li {
float: none;
list-style: none;
left: 0px;
right: 0px;
top: 0px;
position: absolute;
z-index: 6;
height: 26px;
}
Alright, you've got a bewildering mix of floats, absolute positioning, lists, background images, foreground images, margins and padding there. Keep it simple. Don't overcomplicate it. Start with some semantic HTML:
<div id="signup">
<a href="#"><img src="images/signup-off.png" height="26" alt="sign-up off"/></a>
<a href="#"><img src="images/login-off.png" height="26" alt="sign-up off"/></a>
</div>
then work out how to style it. I imagine you want two links next to each other on the right. Easy done.
#signup { overflow: hidden; float: right; }
#signup a { float: left; display: block; margin: 0 10px; padding: 2px 8px; }
精彩评论