Folgender Code hat im Opera ein Fehlverhalten zur Folge:
Code:
<style>
* { margin: 0; padding: 0; }
#menue { margin-bottom: 5em; }
#menue li { display: inline;
float:left;
}
#menue a { display: block;
color: #00F;
background-color: #EEE;
border: 1px solid #000;
border-right-width: 0;
text-decoration: none;
width: 8em;
padding: 1px 0;
text-align: center;
}
#menue a:hover { background-color: #DDD; color: #000; }
</style>
<div id="menue">
<ul>
<li><a href="link1.html">Link 1</a></li>
<li><a href="link2.html">Link 2</a></li>
<li><a href="link3.html">Link 3</a></li>
<li><a href="link4.html">Link 4</a></li>
<li><a href="link5.html">Link 5</a></li>
</ul>
</div>
weiterer Text
Die Links sind nicht mehr anklickbar. Ich habe vier Lösungen gefunden, das Problem zu umgehen. Alle vier sind aber nicht akzeptabel.
1. Ersetzen der Zeile
* { margin: 0; padding: 0; } durch
* { margin: 0; }
2. Ersetzen der Zeile
* { margin: 0; padding: 0; } durch
* { margin: 0; padding: 1px; } und Einfügen von
padding: 0 in
#menue li
3. Löschen von
#menue { margin-bottom: 5em; }
4. Ersetzen von
#menue { margin-bottom: 5em; } durch
#menue { padding-bottom: 5em; }
Kennt jemand diesen Bug? Wie kann man ihn am besten umgehen? Ich präferiere im Moment die 4. Methode.