IE und List-style-types

WiZdooM

Erfahrenes Mitglied
Hi

Ich habe mit Mühe und Not über die letzten Monate eine Webseite zusammengebaut. Navigation über eine Liste mit CSS-Styles, Header, Footer, allen krims-krams. Ich bin nun soweit dass alles mehr oder minder in den gängigen Browsern gleich aussieht.
Außer einer Sache. Ich bekomme Aufzählungen (list-style-types) im IE nicht bzw nicht richtig angezeigt, in den anderen Browsern schon.
An für sich funktioniert folgendes CSS im blanken Dokument prima:

Code:
<div style="position:absolute">
    <div style="width:200px; height:600px; position:relative; overflow:scroll-y; float:left; border-right: 1px #404040 solid; margin-left:15px" class="text">
        <div class="articleheader" style="margin:0">Themengebiete:</div>
        <ul style="list-style-type: square; display:list-item !important;">
        <li>Motoraufbau und Funktionsweise </li>
        </ul>
    </div>
</div>
Aber innerhalb meiner Hierarchie im HTML-Baum habe ich irgendwo einem Identifikator oder einer Klasse eine Eigenschaft zugewiesen, die im o.g. Segment das Aufzählungszeichen rechtsbündig auf Höhe des divs "Themengebiete" positioniert, den Text "Motoraufbau und Funktionsweise" aber eine Zeile darunter anordnet. Entferne ich hier vom <ul> das "display:list-item !important" bekomme ich gar kein Aufzählungszeichen angezeigt.

Da das in etwa das Gleiche ist wie die Ferndiagnose beim Arzt, versuche ich meine Frage allgemein zu formulieren:

Welche CSS-Befehle oder Kombinationen von Befehlen, die auf ein übergeordnetes Element wirken, können im IE verhindern, dass ein Aufzählungszeichen dargestellt wird ? Oder umgekehrt gefragt: Welche Befehle müssen in einem Style für einen Listencontainer stehen, damit auch der IE das Aufzählungszeichen (an der richtigen Stelle) anzeigt ?
 
Aber innerhalb meiner Hierarchie im HTML-Baum habe ich irgendwo einem Identifikator oder einer Klasse eine Eigenschaft zugewiesen, die im o.g. Segment das Aufzählungszeichen rechtsbündig auf Höhe des divs "Themengebiete" positioniert, den Text "Motoraufbau und Funktionsweise" aber eine Zeile darunter anordnet.
Mögliche Fehlerursache: eine float:left-Deklaration, wenn die Liste das vorangegangene DIV rechtsseitig umfliesst.

HTML:
<ul style="list-style-type: square; display:list-item !important; clear:left; /* Umfluß abbrechen */">


Denkbar wäre aber auch eine Form des hasLayouts.

Welche CSS-Befehle oder Kombinationen von Befehlen, die auf ein übergeordnetes Element wirken, können im IE verhindern, dass ein Aufzählungszeichen dargestellt wird ?
Negative Außen-/Innenabstände oder Positionsangaben beispielsweise.

Oder umgekehrt gefragt: Welche Befehle müssen in einem Style für einen Listencontainer stehen, damit auch der IE das Aufzählungszeichen (an der richtigen Stelle) anzeigt ?
Bei einem "klassischen" Listenzeichen benötigt der IE da eigentlich keine Sonderbehandlung :-)

Du versuchst hier aber, mit der display:list-item-Regel ein zusätzliches zweites Listenzeichen neben dem vom <li>-Element automatisch erzeugten anzuzeigen, was dir im aktuellen IE8 geglückt ist, seine Vorgänger können da nicht mithalten.

mfg Maik
 
Danke Maik für die Aufklärung soweit.

Die Problematik mit dem Umfluss ist mir schon bekannt. Ich glaube jedoch in meinem Fall sind es noch andere Faktoren wie
- display,
- postion,
- overflow
- height und width
die in die Darstellungsproblematik einfließen.

Denkbar wäre aber auch eine Form des hasLayouts.
Dein Link ist erste Sahne! Ich werde mal schauen wo ich die Daumenschrauben anlegen kann.

Bei einem "klassischen" Listenzeichen benötigt der IE da eigentlich keine Sonderbehandlung :-)

Du versuchst hier aber, mit der display:list-item-Regel ein zusätzliches zweites Listenzeichen neben dem vom <li>-Element automatisch erzeugten anzuzeigen, was dir im aktuellen IE8 geglückt ist, seine Vorgänger können da nicht mithalten.
Ich gebe dir Recht, dass im klassichen Fall keine Sonderbehandlung nötig ist. Mein initiales HTML - Fragment zeigt die Listenmarker auch fehlerfrei an solange es sich in einem blanken Dokument befindet. Im Kontext meiner Webseite kommt wie gesagt es zur Fehldarstellung (falsche Position oder gänzliches Verschwinden)

Im Übrigen ist die zusätzliche display:list-item-Regel keine so gute Idee gewesen. Ich hatte in anderen Browsern dann 2 Marker...

So far thanks again, Maik!


Edit: Perfekt. Das Problem hat mich schon seit langem beschäftigt. Man findet nur kein Allheilmittel im Netz. Mit den Tips vom hasLayout hat sich das zufriedenstellend gelöst! Nochmals Danke Maik!
 
Zuletzt bearbeitet:
Zurück