CSS-Menü mit Mouseover
Hallo Community,
ich suche jetzt schon eine halbe-Stunde nach einer Lösung, weiß aber nicht genau, nach welchen Schlagwörtern ich ausschau halten soll. Deswegen stelle ich jetzt einfach mal hier mein Problem zur Schau und hoffe, dass mir jemand helfen kann. Auf dongomillo.de findet Ihr eine Navigation, die noch nicht so funktioniert, wie ich es gerne hätte. Ich möchte bei dem Mouseover, dass der orange Balken ganz links an den Rand rutscht, über die komplette Höhe der Zeile geht und der Text da stehen bleibt, wo er jetzt ist. Solche Navigationen habe ich schon zig mal gesehen, nur jetzt wo ich eine brauche, finde ich keine ;/ Das CSS-File könnt Ihr unter http://dongomillo.de/styles.css einsehen. Wie Ihr sicher auf den ersten Blick erraten könnt, beschäftige ich mich noch nicht lange mit CSS. Trotzdem hoffe ich hier eine Antwort zu finden. Besten Dank schonmal! Grüße, Roman |
Über border:
Gib deinem Link einen linken border in der Hintergrundfarbe deiner Navi-Box: Code:
.navi_link a { |
Ok, damit verdrängt der mir den Text schonmal nicht mehr. Das ist schonmal Gold wert ;)
Es bleibt allerdings weiterhin das Problem bestehen, dass der Balken direkt an der Schrift klebt und nicht ganz links, wo er hingehört und nicht in voller Höhe über die Zeile. Hat da jemand eine Idee für? |
Das liegt an der Klasse .navi_link:
Code:
.navi_link Nimm das text-ident mal raus und setze dafür: Code:
.navi_link a SELFHTML: Stylesheets / CSS-Formate definieren / Das CSS Box-Modell text-indent: Texteinrückung: CSS-Referenz auf CSS 4 You - The Finest in Stylesheets bzw. padding-left: Innenabstand links: CSS-Referenz auf CSS 4 You - The Finest in Stylesheets |
Super, das funktioniert schonmal. Der Rahmen ist ganz links, geht aber noch nicht über die volle Zeilenhöhe...da finde ich den Fehler leider ebenfalls nicht.
Könnte mir da nochmal kurz jemand auf die Sprünge helfen? Danke für Eure Geduld!! PS: Die Seite mit der Vererbung habe ich mir gerade durchgelesen...klingt alles logisch ;) |
Falls es interessant ist: Wenn ich den Balken in ".navi_link" anzeigen lasse (andere border-left-Farbe), dann geht der über die komplette Zeilenhöhe. Nur in ".navi_link a:hover" funktioniert es dann nicht.
Ich komm nicht weiter. Hilfe!! |
Du suchst display:block.
Wie wär's mit einem Buch? Little Boxes eignet sich. Du willst ja offensichtlich Webdesign als Dienstleistung anbieten. Dann solltest du die Grundlagen auch sicher beherrschen. |
Ne, mache eine Ausbildung zum Mediengestalter. Da ist es zum Glück nur ein Schulprojekt, in dem wir eine eigene Dienstleistung "simulieren" sollen. Aber da ich mich auch privat dafür interessiere, werde ich mir das Buch mal bei Amazon angucken.
Danke für die Hilfe! Habe dafür alle Helfer gut bewertet ;) Grüße, Roman |
Zitat:
Dann schreib das mal lieber groß und deutlich auf deine Seiten. Das große G hat dich bald. |
Alle Zeitangaben in WEZ +2. Es ist jetzt 16:08 Uhr. |
Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.
© Dirk H. 2003 - 2023