zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Grafik des Hauptmenüpunktes bei Aktivierung eines Links des Untermenüs verschwunden

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 02.11.2010, 13:38
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 02.11.2010
Beiträge: 5
makalus befindet sich auf einem aufstrebenden Ast
Standard Grafik des Hauptmenüpunktes bei Aktivierung eines Links des Untermenüs verschwunden

Hallo liebe CSS-Profis,
ich habe ein kleines Problem mit meiner verschachtelten Liste.
Diese sieht wie folgt aus:
Code:
<ul>
<li><a>Haupteintrag</a>
<ul>
<li><a>Unterpunkt 1</a></li>
<li><a>Unterpunkt 2</a></li>
</ul>
</li>
</ul>
Wird nun zum Beispiel Unterpunkt 2 angeklickt, verschwindet die Hintergrundgrafik vom Haupteintrag. Ist dein Unterpunkt angeklickt, ist die Grafik noch da.
Ich kann mir das absolut nicht erklären. Ich denke mal, dass es an der verschachtelten Liste liegt.
Ich habe versucht, die Liste mit dem Haupteintrag eine Klasse zu geben, leider erfolgslos.

Hier ist der CSS-Code:
Code:
#container #links UL UL 
{
margin-top: 10px; padding: 0; margin: 10px 0 0 -7px; width: 178px; font-size: 1.2em;
} #container #links UL UL LI {
list-style: none; background: url(img/hg-button-menue2-inaktiv.png) no-repeat bottom; padding: 0; margin: 0; min-height: 17px; _height: 20px; line-height: 15px;
} #container #links UL UL LI A {
text-decoration: none; font-size: 0.7em; font-weight: bold; color: #094018; display: block; padding: 2px 0 1px 16px; min-height: 17px; letter-spacing: -0.04em;
} #container #links UL UL LI A:HOVER, #container #links UL UL LI.aktiv A {
background: url(img/hg-button-menue2-aktiv.png) no-repeat bottom; color: #1E6930;
} #container #links UL UL LI.aktiv LI A {
background: url(img/hg-button-menue2-cat1-inakt.png) no-repeat bottom; padding: 2px 0 2px 25px; color: #094018;
} /* # # # # # # # # Unterkategorie 1 */ #container #links UL UL UL {
padding: 0; margin: 0; width: auto;
} #container #links UL UL UL LI {
background: url(img/hg-button-menue2-cat1-inakt.png) no-repeat bottom #A3C02A;
} #container #links UL UL UL LI A {
font-size: 0.65em; padding: 2px 0 2px 25px;
} #container #links UL UL UL LI A:hover, #container #links UL UL UL LI.aktiv A {
background: url(img/hg-button-menue2-cat1-aktiv.png) no-repeat bottom;
} #container #links UL UL UL LI.aktiv LI A {
background: url(img/hg-button-menue2-cat2-inakt.png) no-repeat bottom; padding: 2px 0 2px 30px; color: #094018;
}
Ich wäre für Tipps, wie man diese Hintergrundgrafik beibehalten kann, sehr dankbar.
Ich bedanke mich sehr für eure Mühen.
Beste Grüße
Maik
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 02.11.2010, 14:30
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

Poste mal einen Link, Deine Grafiken hat hier niemand (und in 50% aller Fälle zeigen gepostete Code-Schnipsel eh den Fehler nicht).

Und wirf diese unsägliche Vert'zenrt. per height und line-height raus - beide Eigenschaften weg und mit padding zentr.
__________________
Wer keinen Link auf seine problembehaftete Seite posten kann, weil diese noch nicht online ist: Testcase bauen, online stellen, Link posten.
Internet-Grundregel: Unbekannte Begriffe googeln! (Erspart 99% aller Nachfragen.)
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 02.11.2010, 15:48
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 02.11.2010
Beiträge: 5
makalus befindet sich auf einem aufstrebenden Ast
Standard

Vielen Dank für deine Antwort heiko.

Hier ist der Link zu der Seite:

los-crachos-headshop.de

Wenn du dort beispielsweise Glasbongs unter der Rubrik Bong Shop anklickst und dann einen Unterpunkt auswählst, verschwindet einfach die Grafik von Glasbongs (Pfeil). Ich kann das nicht nachvollziehen.

Beste Grüße
Maik
Mit Zitat antworten
  #4 (permalink)  
Alt 02.11.2010, 15:57
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.775
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

Die Grafik ist schon da. Sie wird unten im li-Element positioniert. Bei geöffnetem Submenü ist das li-Element aber (zu) hoch wegen des Submenüs.
Im aktiven Zustand liegt die Grafik im Link. Der ist nicht so hoch.
Mit Zitat antworten
  #5 (permalink)  
Alt 02.11.2010, 16:33
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 02.11.2010
Beiträge: 5
makalus befindet sich auf einem aufstrebenden Ast
Standard

Vielen Dank für eure Antworten.

Zitat:
im FF 3.6.12 und IE8 sehe ich die Grafik(http://los-crachos-headshop.de/templ...tton-menue.jpg) auch wenn ich einen Untermenüpunkt ausgewähle
Diese Grafik meine ich nicht. Ich meine den Pfeil mit dem Unterstrich hinter jedem Listeneintrag.
Wenn zum Beispiel auf Glasbongs geklickt wird, klappt ein Untermenü auf. Klickt man da ein Untermenüpunkt an, verschwindet der Pfeil vor "Glasbongs".

Die Grafik habe ich nicht dem A-Element zugewiesen sondern dem LI-Element. Ich komme mit dieser Schachtelung einfach nicht klar. Sobald ein Untermenüpunkt angeklickt ist, verschwindet einfach die Grafik vom Hauptmenüpunkt, sehr eigenartig.

Zitat:
Die Grafik ist schon da. Sie wird unten im li-Element positioniert. Bei geöffnetem Submenü ist das li-Element aber (zu) hoch wegen des Submenüs.
Im aktiven Zustand liegt die Grafik im Link. Der ist nicht so hoch.
Achso, deshalb habe ich vorher das Problem gehabt, dass er immer vor dem letzten Listeneintarg diese Grafik eingefügt hat ...
Das habe ich dadurch behoben, dass ich nach dem URL-Befehl die Farbe des Hintergrundes gesetzt habe.
Vielleicht habe ich erfolg, wenn ich den A-Elementen die Grafik zuweise. Ich melde mich wieder bei Euch.

Besten Dank für eure Hinweise und Tipps.
Beste Grüße
Maik

Geändert von makalus (02.11.2010 um 16:37 Uhr)
Mit Zitat antworten
  #6 (permalink)  
Alt 02.11.2010, 16:46
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

Die Nachteile Deiner bottom-Pos. siehst Du auch bei zweizeiligen Menüpunkten. Listensymbole am besten immer mit einem vert. Wert in em ausrichten, z.B. 0 .3em - dann wandern sie bei Textzoom langsam mit nach unten. Nur wenn ein Zeilenumbruch absolut ausgeschlossen ist, kann man auch 0 50% o.ä. schreiben (in Deinem Fall aber nicht).

In jedem Falle solltest Du das Listensymbol von der border trennen, d.h. nicht in beides in eine Grafik stecken (für border brauchst Du eh keine Grafik).
__________________
Wer keinen Link auf seine problembehaftete Seite posten kann, weil diese noch nicht online ist: Testcase bauen, online stellen, Link posten.
Internet-Grundregel: Unbekannte Begriffe googeln! (Erspart 99% aller Nachfragen.)
Mit Zitat antworten
  #7 (permalink)  
Alt 02.11.2010, 18:56
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 02.11.2010
Beiträge: 5
makalus befindet sich auf einem aufstrebenden Ast
Standard

Danke für die hilfreiche Antwort.
Ich arbeite im Rahmen meines Praktikums an dieser Seite und arbeite an dem Menü.
Die Grafik mit dem Pfeil soll aber so bleiben.
Nun weiß ich aber auch, dass die Zeile:
Code:
background: url(img/hg-button-menue2-cat1-inakt.png) no-repeat bottom #A3C02A;
gar keinen Sinn macht mit der Farbangabe dahinter. Ich bin mir zuerst gar nicht darüber im klaren gewesen, dass die Liste durch die Unterkategorien logischer Weise größer wird und die Grafik leider nach unten (bottom) rutscht.

Naja, dank euch bin ich jetzt auf jeden Fall schlauer und werde mal sehen, ob ich dieses Problem gelöst bekomme. Ich melde mich dann wieder bei euch, sobald ich Erfolg habe
Beste Grüße und noch einmal vielen Dank für Eure Hilfe.
Maik
Mit Zitat antworten
  #8 (permalink)  
Alt 03.11.2010, 10:36
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 02.11.2010
Beiträge: 5
makalus befindet sich auf einem aufstrebenden Ast
Standard

Hallo Leute,
Ihr habt mir sehr weiter geholfen, dafür vielen Dank.

Es funktioniert jetzt mit der Menüdarstellung.
Ich habe die Grafik nicht den LI-Elementen zugewiesen sondern den A-Elementen.
Ich hab den Wald vor lauter Bäumen nicht mehr gesehen somal der Webdeveloper für FF den Listeneintrag Glasbongs nicht größer dargestellt hat.

@fricca: Das war der entscheidene Hinweis, danke.

Ich muss noch viel lernen, was CSS betrifft. Vor allem die Erbung und die Schachtellung ...

Beste Grüße und besten Dank an alle.
Maik
Mit Zitat antworten
Antwort

Stichwörter
css, hintergrundgrafik, liste, verschachtelt

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
FAQ -- Häufig gestellte Fragen und häufig gegebene Antworten mazzo CSS 10 05.04.2012 18:32
Grafik links unten positionieren UND Text rechts umfließen Worance CSS 3 02.06.2008 23:29
Zeilenüberlappung bei margin-top mit negativem Wert c.weber.os CSS 15 15.10.2005 16:11
Probleme mit 3 spalten luk CSS 3 08.06.2005 15:39
grafik links und rechts unten ohne zwischenraum einbinden ? Kurt CSS 2 08.06.2004 16:04


Alle Zeitangaben in WEZ +2. Es ist jetzt 15:10 Uhr.