• twitter image
  • facebook image
  • youtube image
  • linkedin image
Language: CMS Made Simple Czech CMS Made Simple France CMS Made Simple Spain CMS Made Simple Hungary CMS Made Simple Russia CMS Made Simple Netherlands

All times are UTC




Post new topic Reply to topic  [ 4 posts ] 
Author Message
 Post subject: CSS Menu layout help!
PostPosted: Fri Feb 17, 2012 10:09 am 
Offline
New Member

Joined: Fri Feb 17, 2012 10:02 am
Posts: 2
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}


Top
 Profile  
 
 Post subject: Re: CSS Menu layout help!
PostPosted: Fri Feb 17, 2012 10:59 am 
Offline
Power Poster
Power Poster
User avatar

Joined: Tue Mar 31, 2009 8:45 pm
Posts: 377
Location: Delft, Netherlands
Don't use floats. Use inline-block style in combination with text-allign:justify.


Top
 Profile  
 
 Post subject: Re: CSS Menu layout help!
PostPosted: Fri Feb 17, 2012 11:33 am 
Offline
New Member

Joined: Fri Feb 17, 2012 10:02 am
Posts: 2
Thank you for the reply, how exactly should i change it? i'm very new with CSS.


Top
 Profile  
 
 Post subject: Re: CSS Menu layout help!
PostPosted: Fri Feb 17, 2012 5:16 pm 
Offline
Administrator
Administrator
User avatar

Joined: Thu Mar 09, 2006 5:32 am
Posts: 11812
Location: Arizona
I wouldn't use position unless absolutely needed, a link to the site would help...

_________________
Extensions » Modules/Tags click the name of the module/tag or Help to the right to get its parameters.
Right click and view source is a great way to see what you have to work with.
Check ver. CMSMS, PHP, server OS, in System Information page.
Default content http://multiintech.com/defaultcontent/
People are Wonderful
Business is Great
Life is Terrific
Ever wonder what happened to the Album module? Well it is alive and well.
http://album.multiintech.com/
Image


Top
 Profile  
 
Display posts from previous:  Sort by  
Post new topic Reply to topic  [ 4 posts ] 

All times are UTC


Who is online

Users browsing this forum: No registered users


You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot post attachments in this forum

Search for:
Jump to:  
A2 Hosting