nicht angemeldet
IE macht Lücken in Liste
0 0 0 0 0 0 0 0 0 0 
Gernot Back
0
0
0 1 0
IE macht Lücken in Liste
Hallo,
Ich habe ein Menü welches in allen Browsern so aussehen soll:
Dazu habe ich folgenden Code geschrieben:
<ul id="menu">
<li><a href="#">Foo</a></li>
<li><a href="#">Bar</a>
<ul>
<li><a href="#>Baz</a></li>
<li><a href="#>Bum</a></li>
</ul>
</li>
<li><a href="#">Bab</a></li>
<li><a href="#">Huz</a></li>
</ul>
#menu {
margin: 0;
padding: 0;
list-style-type: none;
text-transform: uppercase;
font-size: 110%;
}
#menu li {
margin: 1px 0;
padding: 0;
}
#menu li a, #menu li strong {
background: #fae4ab;
display: block;
padding: 0.4em 1em;
margin: 0;
text-decoration: none;
color: #4b2c10;
}
#menu li a:hover { background: #faecc8; }
#menu ul { margin: 0; padding: 0; list-style-type: none; }
#menu ul a, #menu ul strong { padding-left: 3em; font-size: 85%; }
Es sieht auch in (fast) allen Browsern genau so aus wie erwartet. Nur im IE nicht, da sieht das dann so aus:
Woran zum Teufel liegt das? Welcher Bug tritt hier auf? Wie kann ich das am einfachsten beheben?
Grüße
Jeena Paradies
-
hi,
<li><a href="#>Baz</a></li>Der Fehler ist im echten Code hoffentlich nicht enthalten? ;-)
Woran zum Teufel liegt das?
Den Whitespace zwischen den Tags mal eliminiert ...?
gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
Hallo,
<li><a href="#>Baz</a></li>
Der Fehler ist im echten Code hoffentlich nicht enthalten? ;-)Ähm hehe ne, das kommt davon dass man für Beispiele den scheiß 'schnell' neu schreibt anstatt alles rauszulöschen ;-)
Den Whitespace zwischen den Tags mal eliminiert ...?
Ja habe ich komplett alle, keine veränderung.
Grüße
Jeena Paradies-
hi,
Den Whitespace zwischen den Tags mal eliminiert ...?
Ja habe ich komplett alle, keine veränderung.Dann darfst du uns ein online-Beispiel zeigen :-)
(Anhand des Bildes nehme ich an, dass du auch dieses vorher anonymisieren möchtest.)gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
Hallo,
Dann darfst du uns ein online-Beispiel zeigen :-)
Und da ist es schon: http://jeenaparadies.net/t/self/ie-listenfehler.html
Grüße
Jeena Paradies-
Hell-O!
Und da ist es schon: http://jeenaparadies.net/t/self/ie-listenfehler.html
Mein IE 6.0 stellt es genauso dar wie der FF 1.5.0.3. (alles unter Win 2k Pro). Wenn du einen IE-Fehler hast, frage bitte immer mit Versionsangabe und Plattform.
Siechfred
-
Hallo Siechfred.
Und da ist es schon: http://jeenaparadies.net/t/self/ie-listenfehler.html
Mein IE 6.0 stellt es genauso dar wie der FF 1.5.0.3. (alles unter Win 2k Pro).
Hm, meiner nicht? Mein IE zeigt die Navigation genau so fehlerhaft an, wie Jeena es schilderte.
Wenn du einen IE-Fehler hast, frage bitte immer mit Versionsangabe und Plattform.
IE 6.0, Debian GNU/Linux.
Einen schönen Dienstag noch.
Gruß, Ashura
--
sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
„It is required that HTML be a common language between all platforms. This implies no device-specific markup, or anything which requires control over fonts or colors, for example. This is in keeping with the SGML ideal.“
[HTML Design Constraints: Logical Markup]-
Hell-O!
Mein IE 6.0 stellt es genauso dar wie der FF 1.5.0.3. (alles unter Win 2k Pro).
Hm, meiner nicht? Mein IE zeigt die Navigation genau so fehlerhaft an, wie Jeena es schilderte.Seltsam. Als ich mir die Seite angeschaut habe, sah es in IE und FF identisch aus, dafür waren die Einträge des Submenüs ein wenig breiter als die übrigen. Jetzt sieht es genau so aus, wie es Jeena beschrieben hat. Eventuell gab es davor eine andere Version?
IE 6.0, Debian GNU/Linux.
Wer vergewaltigt hier wen? (SCNR)
Siechfred
-
Hallo Siechfred.
Jetzt sieht es genau so aus, wie es Jeena beschrieben hat. Eventuell gab es davor eine andere Version?
Möglich, ja. Und vermutlich hast du die gewünschte Fassung gesehen.
IE 6.0, Debian GNU/Linux.
Wer vergewaltigt hier wen? (SCNR)
Keine Sorge, der blaue Klotz ist in einer Weinflasche gefangen.
Einen schönen Dienstag noch.
Gruß, Ashura
--
sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
„It is required that HTML be a common language between all platforms. This implies no device-specific markup, or anything which requires control over fonts or colors, for example. This is in keeping with the SGML ideal.“
[HTML Design Constraints: Logical Markup]
-
-
-
Hallo,
Mein IE 6.0 stellt es genauso dar wie der FF 1.5.0.3. (alles unter Win 2k Pro). Wenn du einen IE-Fehler hast, frage bitte immer mit Versionsangabe und Plattform.
Sorry, dann hast du gerade das erwischt als ich daran arbeitete (habe es wieder zurück gemacht), hier die Arbeitsversion: http://jeenaparadies.net/t/self/ie-listenfehler2.html Funktioniert schon fast, nur dass das overflow: hide; im IE komischerweise nicht greift (und außerdem scheint mir das auch suboptimal).
Die großen lücken habe ich dank a { width: 100%; } wegbekommen, aber dafür hängt das submenü jetzt raus :-/
Grüße
Jeena Paradies-
Hallo Jeena.
Funktioniert schon fast, nur dass das overflow: hide; im IE komischerweise nicht greift (und außerdem scheint mir das auch suboptimal).
Hm, wirklich „http://de.selfhtml.org/css/eigenschaften/positionierung.htm#overflow@title=hide“?
Einen schönen Dienstag noch.
Gruß, Ashura
--
sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
„It is required that HTML be a common language between all platforms. This implies no device-specific markup, or anything which requires control over fonts or colors, for example. This is in keeping with the SGML ideal.“
[HTML Design Constraints: Logical Markup] -
Hell-O!
hier die Arbeitsversion: http://jeenaparadies.net/t/self/ie-listenfehler2.html Funktioniert schon fast, nur dass das overflow: hide; im IE komischerweise nicht greift (und außerdem scheint mir das auch suboptimal).
Wieso, ich wende auf meiner Seite diesen Trick auch an. Wenn du dem Menü-DIV overflow:hidden zuweist, funktioniert es auch im IE6.
Siechfred
-
Hallo Jeena,
Ich würde es so machen:
div { width: 25% } #menu { margin: 0; padding: 0; list-style-type: none; text-transform: uppercase; font-size: 110%; width:100%; } #menu li { margin: 0; padding: 0; width:100%; float:left; } #menu li a, #menu li strong { background: #fae4ab; display: block; padding: 0.4em 1em; margin: 1px 0; text-decoration: none; color: #4b2c10; }Gruß Gernot
-
-
-
hi,
Dann darfst du uns ein online-Beispiel zeigen :-)
Und da ist es schon: http://jeenaparadies.net/t/self/ie-listenfehler.html
Ja, kann im IE 5.01 das Problem nachvollziehen.
Allerdings hast du da die Whitespaces zwischen den Listenelementen _nicht_ entfernt - und sobald ich das mache, zeigt mein IE 5.01 es ordentlich an.
gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }
-
-
-
Hallo Jeena,
Den Whitespace zwischen den Tags mal eliminiert ...?
Ja habe ich komplett alle, keine veränderung.sicher? Wenn ich es mache funktioniert es.
Grüße,
Jochen
-
-
-
Was passiert wenn Du dem li ein display: inline;
zuweist?das margin: 1px 0; könntest Du doch auch dem a-Element zuordnen.
Ansonsten könntest Du den IE probeweise mit dem hier füttern:
ul li,
ul li a,
ul li strong {
height: 1%;
zoom:1;
}vg Mel
-
Hallo Jeena,
Es sieht auch in (fast) allen Browsern genau so aus wie erwartet. Nur im IE nicht [...
Ein möglicher Weg um Listen im IE anzupassen ist der Einsatz von float:
* html li{float:left;clear:left;width:100%}
Grüsse
Cyx23
-
Hallo,
Ich möchte mich bei allen bedanken die mir geholfen haben, die Lösung mit Float war mir persönlich völlig unbekannt, sie ist sehr effektiv und jetzt setze ich sie ein :-).
Danke :-)
Grüße
Jeena Paradies