Posts: 37
Name: Ryan
Location: Indianapolis, IN
|
http://thinkcassis.com/brand360/why.html
Is there any reason why the first and last nav item's shift up approx. 1 pixel?
It's only in IE8.
*edit*
I take that back, it's all versions of IE...
Here's the code.
HTML Code:
<div id="navigation">
<ul id="nav">
<li id="home"><a href="index.html">home</a></li>
<li id="why" class="current"><a href="why.html">why brand360?</a></li>
<li id="merch"><a href="apparel.html">merchandise & apparel</a></li>
<li id="events"><a href="events.html">corporate golf events</a></li>
<li id="contact"><a href="contact.html">contact</a></li>
</ul>
</div><!-- /navigation -->
Code:
#interior #header #top #navigation {
width: 520px;
height: 102px;
float: left;
}
#interior #header #top #navigation #nav {
font-variant: small-caps;
list-style-type: none;
font-size: 13px;
}
#interior #header #top #navigation #nav a {
text-decoration: none;
display: block;
padding-top: 40px;
color: black;
}
#interior #header #top #navigation #nav li {
float: left;
display: block;
}
#interior #header #top #navigation #nav #why.current,#interior #header #top #navigation #nav #merch.current,#interior #header #top #navigation #nav #events.current,#interior #header #top #navigation #nav #contact.current {
border-top: 4px solid #231F20;
}
#interior #header #top #navigation #nav #home:hover,#interior #header #top #navigation #nav #why:hover,#interior #header #top #navigation #nav #merch:hover,#interior #header #top #navigation #nav #events:hover,#interior #header #top #navigation #nav #contact:hover {
border-top: 4px solid #231F20;
}
#interior #header #top #navigation #nav #home {
width: 31px;
margin-right: 13px;
border-top: 4px solid transparent;
}
#interior #header #top #navigation #nav #why {
width: 96px;
margin-right: 13px;
border-top: 4px solid transparent;
}
#interior #header #top #navigation #nav #merch {
width: 142px;
margin-right: 13px;
border-top: 4px solid transparent;
}
#interior #header #top #navigation #nav #events {
width: 143px;
margin-right: 13px;
border-top: 4px solid transparent;
}
#interior #header #top #navigation #nav #contact {
width: 51px;
border-top: 4px solid transparent;
}
Last edited by indyryan; 09-15-2009 at 01:44 PM..
|
