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

09-18-2011, 04:42 AM
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;

#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;

#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;

<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>

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

09-18-2011, 06: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