zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Problem mit meiner liste

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 14.12.2007, 00:11
bea bea ist offline
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 10.02.2004
Beiträge: 41
bea befindet sich auf einem aufstrebenden Ast
Standard Problem mit meiner liste

Hallo und Guten Abend,
ich kämpfe nun schon seit Stunden und finde einfach den Fehler nicht. Hoffentlich kann mir jemand helfen.
Ich habe ein Menü erstellt,das Css sieht so aus:
Code:
#menue{width: 210px;float:left;}
#menue ul { margin: 0 ; padding: 0;font-size: 0.8em;list-style-type:
none;line-height: 1.7em; font-family: Verdana, Arial, Helvetica, sans-serif;}

#menue ul li { /* erste Ebene */
    padding:0;display: block;}

#menue ul li a {color: #333; padding:0.3em 0 0.3em 0.8em;display: block;
text-decoration: none;  border-bottom: 1px solid #fff;}
	
#menue ul li.active ul li a, /* erste Ebene */ #menue ul li a:hover {
    color: #fff; font-weight: bold;
    background: none;
    border-bottom: 0px;}
	
#menue ul li.active a, /* erste Ebene */ #menue ul li a:hover {
    color: #fff; font-weight: bold;
  background: #6883bc;
    border-bottom: 1px solid #fff;}
	
#menue ul li ul li { /* zweite Ebene */
    font-size:0.9em; line-height: 1.2em;
    padding: 0 0 0 2.3em; /* padding und font-weight der ersten Ebene aufheben */
    color: #6883bc;font-weight: normal;}
	
#menue ul li ul li a, /* zweite Ebene */ 
{  color: #6883bc;  border-bottom: 0px;}
	
#menue ul li ul li.active a, /* zweite Ebene */ #menue ul li ul li a:hover {
    color: #6883bc; font-weight: bold;
    background: url(grafik/_hover2.gif) no-repeat 100% 100%;
    border-bottom: 0px;}
und im HTML so:
Code:
  <div id="menue"> 
    <ul> 
      <li class="active"><a href="#">Hauptpunkt Ebene 1</a> 
        <ul> 
          <li> <a href="#">punkt Ebene 2</a> </li> 
          <li> <a href="#">punkt Ebene 2</a> </li> 
          <li> <a href="#">punkt Ebene 2</a> </li> 
          <li> <a href="#">punkt Ebene 2</a> </li> 
        </ul> 
      </li> 
      <li><a href="#">Hauptpunkt Ebene 1</a></li> 
      <li><a href="#">Hauptpunkt Ebene 1</a></li> 
    </ul> 
  </div>
Nun meine Fragen:
Wie bekomme ich denn ein border: 1px solid #fff;oberhalb des zweiten Hauptpunktes hin? Also an der Stelle, wo die zweiteEbene li aufhört?
Und dann stimmt irgendwas mit der zweiten Ebene nicht. Die sollen die Farbe blau haben und erst beim hover weiß werden und eine grafik _hover2.gif bekommen. Ich hoffe sehr, das jemand mir helfen kann. Ich sehs einfach nicht mehr.
Herzlichen Gruß Bea
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 14.12.2007, 00:23
Benutzerbild von Dieter
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 12.09.2003
Beiträge: 3.635
Dieter sorgt für eine eindrucksvolle AtmosphäreDieter sorgt für eine eindrucksvolle Atmosphäre
Standard

Hallo, Bea!

Stimmt denn der Pfad für die Grafik?

Dateinamen dürfen, soweit ich mich recht erinnere, nicht mit einem Unterstrich beginnen!?
__________________
Informationen aus Koblenz-Metternich
-----------------------------------
"Wissen heißt, Fragen zu erwerben."
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 14.12.2007, 00:29
bea bea ist offline
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 10.02.2004
Beiträge: 41
bea befindet sich auf einem aufstrebenden Ast
Standard

Hallo Dieter,
leider liegt es nciht daran Ich hab mal vorsichtshalber den namen geändert in pfeil.gif. Das wars leider nicht.
Herzlichen Gruß Bea
Mit Zitat antworten
  #4 (permalink)  
Alt 14.12.2007, 00:55
Benutzerbild von Dieter
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 12.09.2003
Beiträge: 3.635
Dieter sorgt für eine eindrucksvolle AtmosphäreDieter sorgt für eine eindrucksvolle Atmosphäre
Standard

Gib ausser "a" auch mal den "Rest" der Palette an:

a:link, a:visited, a:hover
__________________
Informationen aus Koblenz-Metternich
-----------------------------------
"Wissen heißt, Fragen zu erwerben."
Mit Zitat antworten
  #5 (permalink)  
Alt 14.12.2007, 01:21
Benutzerbild von etux
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 17.09.2007
Ort: Berlin
Beiträge: 643
etux wird schon bald berühmt werden
Standard

Hallo bea,
Zitat:
Zitat von bea Beitrag anzeigen
Wie bekomme ich denn ein border: 1px solid #fff;oberhalb des zweiten Hauptpunktes hin? Also an der Stelle, wo die zweiteEbene li aufhört?
Code:
#menue ul li.active { border-bottom: 1px solid #fff; }
Zitat:
Und dann stimmt irgendwas mit der zweiten Ebene nicht. Die sollen die Farbe blau haben und erst beim hover weiß werden und eine grafik _hover2.gif bekommen. Ich hoffe sehr, das jemand mir helfen kann. Ich sehs einfach nicht mehr.
Herzlichen Gruß Bea
Code:
#menue ul li.active ul li a /* erste Ebene */ {
    color: #6883bc;
    font-weight: bold;
    background: none;
    border-bottom: 0px;}
#menue ul li.active ul li a:hover {
	color: #fff;
	background: url(grafik/_hover2.gif) no-repeat 100% 100%; }
Grüße: Emil
Mit Zitat antworten
  #6 (permalink)  
Alt 14.12.2007, 02:11
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.848
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von Dieter Krautkrämer Beitrag anzeigen
Gib ausser "a" auch mal den "Rest" der Palette an:

a:link, a:visited, a:hover
Kleiner Tipp zwischendurch: :link kann man sich sparen, und :visited auch, falls es genauso aussieht wie unbesuchte Links. Es reicht eine allgemeine Regel für a, und dann braucht man nur noch die Pseudoklassen aufzuführen, bei denen sich auch etwas ändert (und muß dann natürlich auch nur die Änderungen deklarieren).
Mit Zitat antworten
  #7 (permalink)  
Alt 14.12.2007, 12:04
bea bea ist offline
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 10.02.2004
Beiträge: 41
bea befindet sich auf einem aufstrebenden Ast
Standard

Hallo und Guten Morgen ,
vielen vielen Dank für die Tipps. Ich hab da irgendwie den Wurm in meiner Navigation. Ich weiß gar nicht, warum ich mich so schwer damit tue?? Nun ist der Pfeil sichtbar, die Linie auch an der richtigen Stelle, fast
Gibt es da noch einen Tipp, wie ich den Abstand zwischen Pfeil und Menüpunkt vergrößern kann?? Und dann möchte ich, das die zweite Ebene beim aktiven Zustand nicht unterstrichen wird, das krieg ich nicht hin. border:none ist doch wohl eigentlich der richtige Befehl?? Oder? Aber wohin damit?
Ich bitte noch einmal um Eure Hilfe, das wäre echt nett. Und vielleicht noch eine Frage, der IE 6. mag diese Form des CSS so gar nicht. Da sind die Abstände riesig. Liegt das am line-heigt?
Code:
#menue{width: 210px;float:left;}
#menue ul { margin: 0 ; padding: 0;font-size: 0.8em;list-style-type: none;line-height: 1.7em; font-family: Verdana, Arial, Helvetica, sans-serif;}

#menue ul li ul { /* zweite Ebene */
       margin: 0; /* margin der ersten Ebene aufheben */ }

#menue ul li { /* erste Ebene */
    padding:0;display: block;}

#menue ul li a {color: #333; padding:0.3em 0 0.3em 0.8em;display: block; text-decoration: none;  border-bottom: 1px solid #fff;}

#menue ul li.active { border-bottom: 1px solid #fff; }

#menue ul li.active a, /* erste Ebene */ #menue ul li a:hover {
    color: #fff; font-weight: bold; 	background: #6883bc;    border-bottom: 1px solid #fff;}
	
#menue ul li.active ul li a /* erste Ebene */ {
    color: #6883bc;    font-weight: bold;    background: none;    border-bottom: 0px;}
	

	
#menue ul li ul li { /* zweite Ebene */
    font-size:0.9em; line-height: 1.2em;
    padding: 0 0 0 2.0em; /* padding und font-weight der ersten Ebene aufheben */
    color: #6883bc;font-weight: normal;}
	
#menue ul li ul li a, /* zweite Ebene */ 
{color: #6883bc;  border-bottom: 0px;}
	
#menue ul li ul li.active a, /* zweite Ebene */ #menue ul li ul li a:hover {
    color: #6883bc; font-weight: bold;  background: url(../../grafik/pfeil.gif) no-repeat 0% 50%;  border-bottom: 0px;}

#menue ul li.active ul li a:hover/* zweite Ebene */ {
	color: #fff; background: url(../../grafik/pfeil.gif) no-repeat 0% 50%; }
Viele Grüße
Bea
Mit Zitat antworten
Antwort

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
Problem mit Stylen einer Liste bla CSS 2 15.10.2010 16:28
Mitwachsender Content und Footer Problem Bentham CSS 5 19.09.2010 12:49
Problem mit Margins bei Liste Solander CSS 2 09.03.2007 14:44
Problem mit Liste im IE labergangster CSS 5 05.01.2006 00:41
Formular (Liste) Problem mit IE,.. otc CSS 2 17.03.2005 05:04


Alle Zeitangaben in WEZ +2. Es ist jetzt 11:06 Uhr.