kjetterman
|
Hey everyone!
quick question for ya.... i'm trying to center align the text on my nav bar/menu but it's not working.
Here is what I have:
.nav
{
position: relative;
margin: 0 auto;
width: 1000px;
height: 29px;
z-index: 100;
font-weight: bold;
text-align: center;
}
.menu
{
padding: 0px 0px 0px 0px;
}
* html .nav
{
zoom: 1;
}
.nav .l, .nav .r, .nav .r div
{
top: 0;
position: absolute;
z-index: -1;
overflow: hidden;
height: 29px;
}
.nav .l
{
left: 0;
right: 0px;
}
* html .nav .l
{
width: expression(this.parentNode.offsetWidth-0+'px');
}
.nav .r
{
right: 0;
width: 0px;
}
* html .nav .r
{
left: expression(this.parentNode.offsetWidth-0+'px');
}
.nav .r div
{
width: 1000px;
right: 0;
}
* html .nav .r div
{
left: expression(this.parentNode.offsetWidth-1000+'px');
}
.nav .l, .nav .r div
{
background-position: left top;
background-repeat: no-repeat;
background-image: url('images/nav.png');
}
* html .nav .l, * html .nav .r div
{
font-size: 1px;
background: none;
behavior: expression(this.runtimeStyle.filter?'':this.runtimeStyle.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + (function(){var t=document.getElementsByTagName('link');for(var i=0;i<t.length;i++){var l=t;if(l.href&&/style\\.css$/.test(l.href))return l.href.replace('style.css','');}return '';})()+"images/nav.png',sizingMethod='crop')");
}
/* end Menu */
/* begin MenuItem */
.menu ul li
{
clear: both;
}
.menu a , .menu a span
{
height: 29px;
display: block;
}
* html .menu a , * html .menu a span
{
float: left;
}
.menu a
{
cursor: pointer;
text-decoration: none;
margin-right: 0px;
margin-left: 0px;
}
.menu a span span
{
font-family: 'Arial';
font-size: 12px;
font-weight: normal;
font-style: normal;
text-decoration: none;
color: #658227;
padding: 0 22px;
margin: 0 0px;
line-height: 29px;
text-align: center;
background-image: url('images/item-center.png');
background-position: left top;
background-repeat: repeat-x;
}
* html .menu a span span
{
display: inline;
}
.menu a:hover span span
{
color: #3B3B3B;
background-position: left -29px;
}
.menu li:hover a span span
{
color: #3B3B3B;
background-position: left -29px;
}
* html .menu .menuhover .menuhoverA span span
{
color: #3B3B3B;
background-position: left -29px;
}
/* end MenuItem */
/* begin MenuSeparator */
.nav .separator
{
display: block;
width: 2px;
height: 29px;
text-align: center;
background-image: url('images/item-separator.png');
}
/* end MenuSeparator */
/* begin ContentLayout */
.contentLayout
{
margin-bottom: 0px;
width: 100%;
position: relative;
}/* end ContentLayout */
there's so much code here that i'm not sure where to begin. TIA for your help!
|