zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden CSS-Menü mit Mouseover

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 23.11.2008, 14:39
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 20.11.2008
Beiträge: 6
Gomilli befindet sich auf einem aufstrebenden Ast
Standard 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
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 23.11.2008, 15:02
Benutzerbild von kadees
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 22.06.2004
Ort: in Baden (nicht Schwaben)
Beiträge: 792
kadees wird schon bald berühmt werden
Standard

Über border:
Gib deinem Link einen linken border in der Hintergrundfarbe deiner Navi-Box:
Code:
.navi_link a {
	border-left: 5px solid #ddd;
	}
__________________
Gruss Dieter

Vegetarier essen meinem Essen das Essen weg.
Und unsere Norweger sind reine Karnivoren.

selfhtml | css4you | jendryschik | styleworks | Webdesign mit XHTML und CSS
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 23.11.2008, 15:07
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 20.11.2008
Beiträge: 6
Gomilli befindet sich auf einem aufstrebenden Ast
Standard

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?
Mit Zitat antworten
  #4 (permalink)  
Alt 23.11.2008, 15:38
Benutzerbild von kadees
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 22.06.2004
Ort: in Baden (nicht Schwaben)
Beiträge: 792
kadees wird schon bald berühmt werden
Standard

Das liegt an der Klasse .navi_link:

Code:
.navi_link
color:#434343;
line-height:22px;
text-indent:20px;
}
Grund: CSS 4 You - The Finest in Stylesheets: Workshop CSS: Teil 8 - Vererbung

Nimm das text-ident mal raus und setze dafür:

Code:
.navi_link a
border-left:5px solid #F4F4F4;
padding-left:20px;
}
Informier dich mal:
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
__________________
Gruss Dieter

Vegetarier essen meinem Essen das Essen weg.
Und unsere Norweger sind reine Karnivoren.

selfhtml | css4you | jendryschik | styleworks | Webdesign mit XHTML und CSS

Geändert von kadees (23.11.2008 um 15:40 Uhr)
Mit Zitat antworten
  #5 (permalink)  
Alt 23.11.2008, 16:06
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 20.11.2008
Beiträge: 6
Gomilli befindet sich auf einem aufstrebenden Ast
Standard

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
Mit Zitat antworten
  #6 (permalink)  
Alt 23.11.2008, 18:08
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 20.11.2008
Beiträge: 6
Gomilli befindet sich auf einem aufstrebenden Ast
Standard

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!!
Mit Zitat antworten
  #7 (permalink)  
Alt 23.11.2008, 18:22
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.779
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

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.
Mit Zitat antworten
  #8 (permalink)  
Alt 23.11.2008, 18:27
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 20.11.2008
Beiträge: 6
Gomilli befindet sich auf einem aufstrebenden Ast
Standard

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
Mit Zitat antworten
  #9 (permalink)  
Alt 23.11.2008, 18:45
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.779
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Zitat:
Zitat von Gomilli Beitrag anzeigen
Da ist es zum Glück nur ein Schulprojekt, in dem wir eine eigene Dienstleistung "simulieren" sollen.
Hm.
Dann schreib das mal lieber groß und deutlich auf deine Seiten. Das große G hat dich bald.
Mit Zitat antworten
Sponsored Links
Antwort

Stichwörter
border, css-menü, menü, mouseover, rahmen

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
CSS Spry Menu Problem mit Hintergrund bei Mouseover myron CSS 9 12.07.2009 13:34
css menü - bitte schnell um hilfe :please costfree CSS 2 16.01.2009 12:55
herunterfahrendes Menü mit CSS Pablo CSS 1 27.12.2007 17:07
suckerfish menü formatieren / css zurücksetzen / bug sicnezz (X)HTML 1 13.12.2007 05:47
abgerundete ecken als hintergrund in css menü gollib CSS 3 18.07.2006 00:44


Alle Zeitangaben in WEZ +2. Es ist jetzt 18:00 Uhr.