1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55
|
<style type="text/css">
<!--
body {
background-color: #999;
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
}
#container{
width:600px;
margin:auto;
background-color:#FFF;
height:300px;
}
ul,li{
margin:0px;
padding:0px;
}
ul#menu{
float:right;
}
ul#menu li ul{ position:absolute; right:-1px; border-right:1px solid #000;}
li.level1,li.level2{
list-style-type:none;
display:block;
float:left;
padding:3px 5px 3px 5px;
}
li.level1{position:relative; border-right:1px solid #000;}
li.level2{
font-size:12px;
}
li.last{border:0px;}
-->
</style></head>
<body>
<div id="container">
<ul id="menu">
<li class="level1">Menu 1</li>
<li class="level1">Menu 2</li>
<li class="level1">Menu 3
<ul>
<li class="level2">Bonjour à tous</li><li class="level2">Aurevoir</li><li class="level2 last">Bonsoir</li>
</ul>
</li>
<li class="level1 last">Menu 4</li>
</ul>
</div> |
Partager