nicht angemeldet
hover mit definierter breite
Hi Forum,
Ich habe einen div-Container mit einer Breite von 160px (padding: 5px) als Navigation an der linken Seite. Nun möchte ich gerne, dass die Links da drinnen beim überfahren einen farbigen Hintergrund bekommen. kein Problem mir a.hover. Nur ist hier immer nur der tatsächliche Text hinterlegt.
Ich hätte gerne die komplette Breite von 150px hinterlegt, will aber nicht mit einer Tabelle arbeiten.
Vermutlich geht dass irgendwie mit einem zusätzlichen p-tag oder so... aber ich komm nicht drauf.
Hat jemand einen Tipp für mich?
Danke schon mal... Andreas
-
Moin!
du könntest dem a ein width hinzufügen und es bei a:hover lassen.
tschüss ichen--
Jetzt gehts ab in Urlaub!-
Hi ichen,
a:hover {
color: #ccc;
text-decoration: underline;
background-color: #00E0FF;
width: 150px;
}hat überhaupt keien Auswirkung. Auch die width-angabe in den a selber oder in beiden bewirkt nichts. Fehler bei mir?
Danke soweit... Andreas
Moin!
du könntest dem a ein width hinzufügen und es bei a:hover lassen.
tschüss ichen-
Hi Andreas,
ich hoffe das ist die richtige Lösung:<html>
<head>
<title></title>
<style type="text/css">
a div {width: 160px;
border: 1px solid balck;
text-align: center;
font: 11pt Arial;
padding: 5px;
}
a {text-decoration: none;
color: black;
}
a:hover {background-color: yellow;
}
</style>
</head>
<body>
<a href="#"><div>Hallo</div></a><br>
<a href="#"><div>Hallo</div></a><br>
<a href="#"><div>Hallo</div></a>
</body>
</html>mfg Bernd
-
Hi,
ich hoffe das ist die richtige Lösung:
WAAAAHHHHHH!!!!!3 Nein, das ist eine *absolut* falsche Lösung.
<a href="#"><div>Hallo</div></a><br>
Diese Schachtelung ist *strikt* verboten! (Zudem ist das <br> unsinnig.) Warum versuchst Du, darstellungsspezifische Informationen mittels der Struktur zu vermitteln?
Cheatah
--
X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: No
X-Please-Search-Archive-First: Absolutely Yes-
Hi,
<a href="#"><div>Hallo</div></a><br>
Diese Schachtelung ist *strikt* verboten!Diese Schachtelung ist auch *transitional* verboten! ;-) SCNR ;-)
cu,
Andreas--
MudGuard? Siehe http://www.Mud-Guard.de/
Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
-
-
-
-
-
Hi,
Ich habe einen div-Container mit einer Breite von 160px (padding: 5px) als Navigation an der linken Seite. Nun möchte ich gerne, dass die Links da drinnen beim überfahren einen farbigen Hintergrund bekommen. kein Problem mir a.hover. Nur ist hier immer nur der tatsächliche Text hinterlegt.
Ich hätte gerne die komplette Breite von 150px hinterlegt,entweder wendest Du :hover auf das <div> an, was bis auf veraltete Browser wie Netscape 4 oder der IE jeder beherrscht; oder Du gibst dem <a>-Element die Breite. Beachte hierzu http://www.w3.org/TR/CSS21/visudet.html#propdef-width.
will aber nicht mit einer Tabelle arbeiten.
Gute Wahl.
Vermutlich geht dass irgendwie mit einem zusätzlichen p-tag oder so...
Markup der Darstellung wegen ist eine schlechte Wahl.
Cheatah
--
X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: No
X-Please-Search-Archive-First: Absolutely Yes-
Hi,
Beachte hierzu http://www.w3.org/TR/CSS21/visudet.html#propdef-width.
Vermutlich ein guter Tipp... aber mein englisch...:-(
Danke Dir trotzdem... Andreas
-
-
Moin,
kein Problem mir a.hover. Nur ist hier immer nur der tatsächliche Text hinterlegt.
Naja, was denn auch sonst?
a ist ein Inline-Element.
Mach daraus ein Block-Element, gib ihm eine Breite und dann geht hover auch über die gesamte Breite.Gruß,
-Efchen--
Selfcode: ie:% fl:( br:^ va:{ ls:& fo:) rl:? n4:& ss:) de:> js:| ch:? sh:) mo:) zu:}
Encode: http://forum.de.selfhtml.org/cgi-bin/selfcode.pl
Decode: http://peter.in-berlin.de/projekte/selfcode/-
Hi,
Mach daraus ein Block-Element, gib ihm eine Breite und dann geht hover auch über die gesamte Breite.
wie mache ich daraus ein Block-Element?
Andreas
-
wie mache ich daraus ein Block-Element?
so wie es in selfhtml steht: http://de.selfhtml.org/css/eigenschaften/positionierung.htm#display
Struppi.
-
Jep... so gehts,
Danke Dir und allen anderen Helfern...
Andreas
-
-
-
-
Hi Andreas,
ich hoffe das ist das richtige:<html>
<head>
<title></title>
<style type="text/css">
a div {width: 160px;
border: 1px solid balck;
text-align: center;
font: 11pt Arial;
padding: 5px;
}
a {text-decoration: none;
color: black;
}
a:hover {background-color: yellow;
}
</style>
</head>
<body>
<a href="#"><div>Hallo</div></a><br>
<a href="#"><div>Hallo</div></a><br>
<a href="#"><div>Hallo</div></a>
</body>
</html>mfg Bernd
-
ich hoffe das ist das richtige:
Bestimmt nicht, denn das ist ungültiges CSS. Das hätte dir aber der CSS Validator auch sagen können.
http://jigsaw.w3.org/css-validator/
font: 11pt Arial;
'pt' ist keine sinnvolle Einheit für die Monitordarstellung
http://www.netandmore.de/faq/fom-serve/cache/1153.htmlStruppi.
-
Hi,
da hast du allerdings recht!mfg Bernd
ps: danke für den Tip.
-
Hi,
Bestimmt nicht, denn das ist ungültiges CSS.
ich finde im CSS-Code nur den Fehler, dass "balck" keine gültige Farbe ist. Siehst Du noch mehr?
font: 11pt Arial;
Neben der Einheit (und der ohnehin viel zu kleinen Schriftgröße) ist hier natürlich noch zu bemängeln, dass die generische Schriftfamilie fehlt. Im technischen Sinn ist das aber "nur" eine Warnung.
Cheatah
--
X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: No
X-Please-Search-Archive-First: Absolutely Yes-
Bestimmt nicht, denn das ist ungültiges CSS.
ich finde im CSS-Code nur den Fehler, dass "balck" keine gültige Farbe ist. Siehst Du noch mehr?
Jaja, in dem Moment als ich es abschickte fiel mir auf, dass ich eigentlich HTML meinte.
Also, Bernd dein code ist ungültiges HTML.
Struppi.
-
-
-