Hallo iedereen,

Ik ben sinds kort bezig met het leren en het schrijven van html.
Hier en daar heb ik al topics geopend met vragen over html en css enz..

Dit wordt hier voor mij een beetje een algemeen topic over mijn vragen of problemen die heb ik.

en dat begint nu.

Ben aan het proberen een menu te maken in HTML die aan TOP staat:
Zou graag daar rond een border hebben.
als ik de border code gebruik krijg ik een dubbele rand te zien.
border-right:1px solid #333;is dat rechts maar dan staat er in het begin van mijn menu links geen streepje.
en ook mijn muisover sluit hem niet volledig in! hij ontbreekt een stukje eigenlijk.

ik zou gewoon links als rechts een mooi streepje willen van de menu en dat de muisover volledig is
Hopelijk begrijpt iemand mijn probleem een beetje.
Mvg
Souwen

*{
padding:0;
margin:0;
}
body{
background:#E6EEF3;
}
#header{
height:40px;
border-bottom:4px solid #095472;
text-align:center;
background:#1684AF;
}
.menu{
padding-top:8px;
}
.menu li{
display:inline;
}
.menu li a{
Text-decoration:none;
list-style:none;
padding:15px;
color:#fff;
font-size:16px;
border:1px solid #095472;


}
.menu li a:hover{
background:#095472;
color:#fff;
}
dit is de html code voor wie wil testen:

<!docetype html><html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="layout.css">
</head>

<body>
<div id="header">


<ul class="menu">
<li><a href="">menu</a></li>
<li><a href="">menu</a></li>
<li><a href="">menu</a></li>
<li><a href="">menu</a></li>
<li><a href="">menu</a></li>
<li><a href="">menu</a></li>
<li><a href="">menu</a></li>
<li><a href="">menu</a></li>
<li><a href="">menu</a></li>
</ul>
</div>
</div>




</body>
</html>