Page 1 of 1

CSS Menu layout help!

Posted: Fri Feb 17, 2012 10:09 am
by devildog3261
I am new to CSS and I am trying to make my menu stretch 959pixles. My website is centered in the page and is 959px wide. My menu is on the right but i can't get it to stretch all the way to the left side. i want everything to be evenly proportioned, with no spaces. but i can't seem to get it to work. Any help would appreciated!

My CSS code is bellow:

#menu {
position: absolute;
top: 219px;
right: 1px;
z-index:99
}

#menu > li {
float: left; margin: 0 0 0 0px; position:relative
}

#menu > li > a {
background: url(images/menu-span.gif) repeat-x 0% 0%;
display: inline-block;
height: 38px;
line-height: 28px;
overflow: hidden;
font-size: 1.333em;
font-weight: bold;
text-decoration: none;
color: #636464;
}

#menu > li > a span {
background: url(images/menu-left.gif) no-repeat 0% 0%;
display: inline-block;
}

#menu > li > a span span {
background: url(images/menu-right.gif) no-repeat 100% 0%;
display: inline-block;
height: 29px;
overflow: hidden;
padding: 0 15px 0 15px;
}

#menu > li:hover > a {
cursor: pointer;
color: #2b8eb8;
}

#menu > li.act > a {
color: #2b8eb8;
}

#menu .submenu_1{ position:absolute; top:37px; left:0; width:229px;}
#menu .box_menu{ background:#363636;border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; position:relative; padding:4px 0;}
#menu .submenu_1 li{ position:relative; border-bottom:1px solid #313131; line-height:32px;}
#menu .submenu_1 .end{ border:none}
#menu .submenu_1 li a{ padding-left:27px; font:14px Georgia, "Times New Roman", Times, serif; color:#888e94; line-height:32px; background:url(images/menu_marker.gif) 15px 13px no-repeat; display:block; text-decoration:none}
#menu .submenu_1 li:hover > a{ background-position:15px -20px; color:#47c0ef}

#menu .submenu_2{ position:absolute; top:-4px; left:230px; width:229px;}

#menu div{ display:none}

Re: CSS Menu layout help!

Posted: Fri Feb 17, 2012 10:59 am
by mcDavid
Don't use floats. Use inline-block style in combination with text-allign:justify.

Re: CSS Menu layout help!

Posted: Fri Feb 17, 2012 11:33 am
by devildog3261
Thank you for the reply, how exactly should i change it? i'm very new with CSS.

Re: CSS Menu layout help!

Posted: Fri Feb 17, 2012 5:16 pm
by Dr.CSS
I wouldn't use position unless absolutely needed, a link to the site would help...