...

View Full Version : fit li's in the ul width



pentababu
09-18-2011, 05:42 AM
Hi,
How do I make li's of a ul have equal width occupying entire space of ul combined.

#content-tabs {
background-color: #78ae09;
float: left; /* LTR */
margin: 20px 0;
padding: 0;
-moz-box-shadow: 0px 2px 3px #c4c4c4;-webkit-box-shadow: 0px 2px 3px #c4c4c4;box-shadow: 0px 2px 3px #c4c4c4;
width:100%;
}

#content-tabs ul.primary,
#content-tabs ul.secondary {
/* border-bottom: 1px solid #000;*/
clear: both;
float: left; /* LTR */
margin: 0;
padding: 7px 10px 0px 0px;
width:100%;
border:none;
}

#content-tabs ul.secondary {
border-bottom: none;
margin-top: 10px;
text-transform: lowercase;
}

#content-tabs ul.primary li,
#content-tabs ul.secondary li {
border-style: none;
display: inline-block;
float: left; /* LTR */
list-style: none;
margin: 0 10px;
padding: 0;
white-space:nowrap;
}


<div id="content-tabs" class="content-tabs block">
<div id="content-tabs-inner" class="content-tabs-inner inner clearfix">
<ul class="tabs primary">
<li class="active" ><a href="#" class="active">Organize</a></li>
<li ><a href="#">Edit Blog Settings</a></li>
<li ><a href="#">Create Post</a></li>

</ul>
</div><!-- /content-tabs-inner -->
</div><!-- /content-tabs -->

Mr.
09-18-2011, 07:12 AM
if i know what you're saying correctly, you could do this:

if you have a ul that is 100% in width and you have four li within that ul.. you could add...

width: 25%;


to your css selector.. #content-tabs ul.primary li,
#content-tabs ul.secondary li {



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum