Log in

View Full Version : Navigation Should Get auto Width with list



hashmatabbas
08-27-2009, 09:43 AM
Hi,

iam trying to made a navigation with auto stretchable width.

for example..

nav width is 1000px;

if it has 4 tab than each tab should auto get 250px each to get align with the nav.

if i insert 10 tabs than each tab het auto width of 100px each to get aligh with the tab

like tables ....

Any one have idea..Please HELPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPPP..:)

simcomedia
09-16-2009, 09:18 PM
You would need to use a <ul> list for the navigation. Then set the width for the <li>'s to the percentage you need. Kind of like this:

.menu ul {
width: 100%;
display: inline;
}

.menu li {
width: 25%;
}

.menu li a:link {
font-family: Arial;
font-size: 10pt;
color: #fff; // white against red background
text-decoration: none;
}

.menu li a:hover {
font-family: Arial;
font-size: 10pt;
color: #FFE900;
background-color: #0000FF;
}

Then wrap it in a container div:

#menuwrap {
width: 1000px;
position: relative;
height: 30px; // optional but helps
background-color: #FF0000;
}

This code isn't perfect but gives you something to work with :)