nicht angemeldet
Hey
Ja, das macht es deutlicher. Es hilft aber nichts: ich kann das mit deinem Code nicht nachstellen bzw. nachvollziehen, bei mir sieht es immer so aus, wie du es gerne haben möchtest.
Das hat mich sehr gewundert, deshalb habe ich gedacht es liegt an meinem IE und es auf einem zweiten Computer ausprobiert und hatte denselben Effekt. Der border kommt durch.
Ich habe dir bereits geraten, die Tabellen zu entfernen, da sie sowieso zweckentfremdet eingesetzt werden. Es gibt einen zusätzlichen Fehler: du verwendest zwei Tabellen, teilst aber beiden dieselbe ID zu.
Sorry für das mit den ids, Schlampigkeitsfehler in der Verzweiflung. Ich habe das ganze nochmal in einer zweiten Version mit Listen (Code unten) und in einer dritten mit div für jeden einzelnen link nachgebaut. Ausserdem den CSS-Code ein bisschen entrümpelt. Der Effekt bleibt immer derselbe.
Ausserdem liegt es nicht an dem background-hover (den hab ich inzwischen entfernt), es passiert in dem Moment, in dem die Links überfahren werden.
Wenn man dagegen den a:hover entfernt bleibt der border beim überfahren des Links wo er sein soll und tritt allerdings während des anklickens des Links kurz zum Vorschein.
Und nochwas: Wenn man den rechten Teil (div id="right") herausnimmt funktioniert alles wie gewollt.
Grüsse aus Hambuich und Danke für die Mühe,
Nils.
<html>
<head>
<title>border</title>
<style type="text/css">
#box1 {
border:solid 1px #900;
position:relative;
margin:0 0 0 7em;
width:500px;
height:400px;
}
.menu1 li {
background-color:#aaa;
width:200px;
border:solid 1px #000;
margin-top:5px;
}
.menu1 a:hover {
color:#fff;
}
#left {
float:left;
position:relative;
right:140px;
width:210px;
}
#right {
float:right;
position:relative;
left:40px;
width:210px;
}
</style>
</head>
<body>
<div id="box1">
<div id="left">
<ul class="menu1">
<li><a href="border4.html">link1</a></li>
<li><a href="border4.html">link2</a></li>
</ul>
</div>
<div id="right">
<ul class="menu1">
<li><a href="border4.html">link3</a></li>
<li><a href="border4.html">link4</a></li>
</ul>
</div>
</div>
</body>
</html>