CSS horizontal menu problem [Archive]

kevinvdw

09-19-2006, 08:17 PM

Hello

I tried to create a horizontal menu for a website. The problem is that i can't get it to listen to my pixel size. I need a menu that consists out of 7 items, seperated by 3px whitespace. The first and last item are 111px, the rest 112px.

is this possible in css and if so how? i am allready getting crazy from trying.

I know it has something to do with creating a list but then the problem is that i can only use padding: ..EM for setting up the size and that is not my idea. I also know that it is easy to solve with a table, but i refuse to use it for layout.

please help

Greetz kevin

harbingerOTV

09-20-2006, 12:40 AM

something like:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>???</title>
<style type="text/css">
* {
padding: 0;
margin: 0;
}
body {
background: #666;
}
ul {
list-style: none;
}
li {
float: left;
}
li a {
width: 112px;
display: block;
text-align: center;
margin: 0 3px;
background: #ffc;
}
li a.firstlast {
width: 111px;
}
</style>
<ul>
<li><a href="" class="firstlast">link</a></li>
<li><a href="">link</a></li>
<li><a href="">link</a></li>
<li><a href="">link</a></li>
<li><a href="">link</a></li>
<li><a href="">link</a></li>
<li><a href="" class="firstlast">link</a></li>

</head>
<body>
</body>

</html>