[Racine des codes] [Page précédente]

rounded-google

/Html JavaSript/html/rounded-google.html
<html><head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">

<style type="text/css">
ul {
    list-style-type:none;
    padding:0;
}

li, li a {
    display:block;
    position:relative;
    border:1px #ccc solid;
}

li {
    border-width:2px 0; /* 1px 0 */
    margin:4px;
}

li a {
    border-width:0 2px; /* 0 1px */
    margin:0 -2px; /* <- the tips */
    background-color:#eee;
    text-decoration:none;
    color:#555;
}

li a:hover {
    background-color:#ddd;
}
li > a:hover, li:hover {
    border-color:#aaa;

</style>

</head><body>

<div>
One pixel notched corners as used by Google Analytics<br>
http://www.askthecssguy.com/2008/03/one_pixel_notched_corners_as_u.html
</div>

<div  style="width:120px">
<ul>
  <li><a href="#">Testlink</a></li>
  <li><a href="#">Testlink</a></li>
  <li><a href="#">Testlink</a></li>
  </li>
</ul>
</div>

<br>

<div style="width:170px; border:0 solid blue; border-width:1px 0; text-align:center">
  <div style="border:0 solid blue; border-width:0 1px; margin:0 -1px;">
sur deux div inbriqués
  </div>
</div>

</body></html>
[edit]