nicht angemeldet
Navigation Hover bei Border geht nicht
Hallo,
ich habe folgendes Problem. Nach langem hin und her hab ich es nun geschafft den Hover Effekt einzubauen. Im Safari und Mozilla klappts auch wunderbar.. nur der IE zickt rum und macht das nicht so wie ich das gerne hätte.
Er macht nämlich.. gar nix :(
Hier mal fix der Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<link rel="stylesheet" type="text/css" href="style/style.css">
</head>
<body>
<div style="border-style:none; width:50%; margin:auto; top:60px; position:relative; z-index:1;">
<ul class="menu1">
<li><a href="#" >01 NEWS</a></li>
<li ><a href="#" >02 HIGHTLIGHTS</a></li>
<li><a href="#">Impressum</a></li>
</ul>
</div>
</body>
</html>
und der wichtige Teil ausm CSS
@charset "ISO-8859-1";
ul.menu1 {
padding: 0px;
margin: 0px;
list-style: none;
font-family: Courier New;
color:#3b3b3b;
font-size: 11px;
font-weight:bold;
width:100%;
}
a, a:visited {text-decoration: none; color:#3b3b3b; }
ul.menu1 li {float: left; padding-right:10px; border-bottom-style: solid; border-color:#cccccc; border-width:5px;}
ul.menu1 li a:hover {border-bottom-style: solid; border-color:#3b3b3b; border-width:5px; }
Und was leider noch ein Problem ist, welches ich nicht fähig bin zu lösen :/
Die Menüpunkte liegen alle nebeneinander.. wie kriege ich es hin, dass z.B. links die ersten beiden Menüpunkte stehen und rechts dann das Impressum?
Der Graue Balken soll quasi über 50% der Seite gehen und sich dann dort, wo der Text steht verändern. Ich habe leider keine Festen Grössen der verschiedenen Menüpunkte, sonst könnte man ja ein Leeres Listenelement einfügen, aber sobald ich diesem die Breite 100% gebe wird verständlicherweise eine neue Zeile eingefügt :/
Hoffe jmd hat eine Idee
Grüße cleo
-
Hall cleo,
kann deinem Problem leider nicht so ganz folgen, bzw ich verstehe deine Fragen nicht so wirklich. hast Du vielleicht einen Link wo man sich das Problem mal anschauen kann?Gruß
Tunnel85-
Na klar,
www.diinit.de/layout.php
Also im Mozilla wird die graue leiste unter den Links dunkler, im IE nicht.
und das zweite wäre.. ich hätte die obere leiste gerne genauso lang wie die untere (also die unter dem bild)
Gruß cleo
-
Sorry, muss leider klein beigeben, wüsste nicht wie man dein Problem lösen kann.Mein Ansatz wäre gewesen:
ul.menu1 li {float: left;display:block;width:33.3%;text-align:center} ul.menu1 li a,a:link {border-bottom:5px solid #ccc;display:block} ul.menu1 li a:hover {border-bottom:5px solid #707070;display:block}Dadurch müsstest du aber den li-Elementen feste Größen zuweisen(50% / Anzahl der Links) und vom Design her ist es dann natürlich nicht mehr ganz das was Du willst.Oder du müsstest für jedes li-Elemente eine klasse machen, in der die Größe für das jeweilige Element bestimmt wird. Ein anderer Lösungsweg fällt mir leider nicht ein.
Grüße
Tunnel85-
:)
"vom Design her nicht mehr ganz das" geht nicht. Muss das sein :(
Öhm gehts denn bei dir im ie dann mit dem hover?
-
Öhm gehts denn bei dir im ie dann mit dem hover?
IE6, IE7 und FF getestet - läuft.
Nicht mehr ganz das Design ist ja relativ, du müsstest halt nur für jeden Button die Größe einzeln angeben, dann wäre das Design wie vorher.
Gruß
Tunnel
-
-
-
-