loepzuiver

My site/blog; http://www.loepzuiver.net/blog/

the three textbuttons used to sit on top of the three darkblue bars. (wich is an background picture)

Now only HOME stands correct, and DE ROUTE + CONTACT are placed to the right with spacing.

My header.php

<div class="wrap">
    <div class="header">
        <ul class="menu" id="nav">

            <?php wp_list_pages('hide_empty=0&title_li='); ?>

        </ul>
    </div>
        <div class="content">
        	<div class="content_left">
                <div class="content_right">

My Styls.css

ul.menu
{
	margin:0px;
	padding:0px;
	list-style:none;
	position:absolute;
	top:20px;
	left:30px;
}

ul.menu li
{
	float:left;
	font:bold 15px/15px Arial, "Times New Roman", Times, serif;
	text-transform:uppercase;
	color:#ffffff;
	padding:0 21px 0 0;
	margin:0;
	position:relative;
}
ul.menu li a, ul.menu li a:visited
{
	color:#ffffff;
}
ul.menu li a:hover
{
	color:#bb334d;
}

ul.menu li ul
{
	position: absolute;
	left:0px;
	top: 10px;
	padding:0;
	margin:0;
	display:none;
	width:150px;
	background:#cabf72;
	list-style:none;
}

ul.menu li ul li
{
	float:none;
	padding:5px 0 5px 5px;
	display:block;
	margin:0;
	position:relative;
	border-bottom:1px dashed #71691c;
}
ul.menu li ul li ul
{
	position: absolute;
	left:150px;
	top:0px;
	display:none;
	padding:0px 0 0 0;
	list-style:none;
}

ul.menu li:hover ul, ul.menu li.over ul { display: block; }
ul.menu li:hover ul li ul, ul.menu li.over ul li ul { display: none; }
ul.menu li ul li:hover ul, ul.menu li ul li.over ul { display: block; }