nicht angemeldet
IE cleart falsch
Gunnar Bittersmann
0 0
0 0 0
IE cleart falsch
Gunnar Bittersmann
Der Martin@@alle:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="und" lang="und"
>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>TEST</title>
<link rel="stylesheet" type="text/css" href="myStyle.css"/>
</head>
<body>
<ul>
<li id="item1">1</li>
<li id="item2">2</li>
<li id="item3">3</li>
<li id="item4">4</li>
<li id="item5">5</li>
<li id="item6">6</li>
</ul>
</body>
</html>
myStyle.css:
ul
{
margin: 0;
padding: 0;
list-style: none;
width: 150px;
}
li
{
color: white;
width: 42px;
height: 42px;
float: left;
margin: 4px;
display: inline;
}
#item2
{
height: 72px;
}
#item1, #item4
{
background: red;
clear: both;
}
#item2, #item5
{
background: green;
}
#item3, #item6
{
background: blue;
}
Vernünftige Browser stellen das wie gewünscht dar:
┌───┐┌───┐┌───┐
│ 1 ││ 2 ││ 3 │
└───┘│ │└───┘
│ │
└───┘
┌───┐┌───┐┌───┐
│ 4 ││ 5 ││ 6 │
└───┘└───┘└───┘
IEs hingegen (6 & 7) denken trotz des 'clear' für #item4, dass ja für #item5 weiter oben noch Platz wäre und stellen das so dar:
┌───┐┌───┐┌───┐
│ 1 ││ 2 ││ 3 │
└───┘│ │└───┘
│ │┌───┐
└───┘│ 5 │
┌───┐ └───┘
│ 4 │┌───┐
└───┘│ 6 │
└───┘
Kann man IEs irgendwie zu der gewünschten Darstellung bewegen?
Live long and prosper,
Gunnar
--
Erwebsregel 208: Manchmal ist das einzige, was gefährlicher als eine Frage ist, eine Antwort.
Erwebsregel 208: Manchmal ist das einzige, was gefährlicher als eine Frage ist, eine Antwort.
-
Grüße,
┌───┐┌───┐┌───┐
│ 1 ││ 2 ││ 3 │
└───┘│ │└───┘
│ │┌───┐
└───┘│ 5 │
┌───┐ └───┘
│ 4 │┌───┐
└───┘│ 6 │
└───┘cool - wie geht denn das?
MFG
bleicher-
Yerf!
┌───┐┌───┐┌───┐
│ 1 ││ 2 ││ 3 │
└───┘│ │└───┘
│ │┌───┐
└───┘│ 5 │
┌───┐ └───┘
│ 4 │┌───┐
└───┘│ 6 │
└───┘cool - wie geht denn das?
Mit CSS!
*scnr*
Gruß,
Harlequin
--
<!--[if IE]>This page is best viewed with a webbrowser. Get one today!<![endif]-->-
Grüße,
cool - wie geht denn das?
Mit CSS!
*scnr*
nein - ich meine die kästchen di edu hier abgebildet hast - ich wusste gar nciht, dass es diese zeichen ┌ ┐└ ┘ gibt^^ mehr info evtl.?
MFG
bleicher-
@@bleicher:
nein - ich meine die kästchen di edu hier abgebildet hast - ich wusste gar nciht, dass es diese zeichen ┌ ┐└ ┘ gibt^^ mehr info evtl.?
http://www.unicode.org/charts/PDF/U2500.pdf
Live long and prosper,
Gunnar--
Erwebsregel 208: Manchmal ist das einzige, was gefährlicher als eine Frage ist, eine Antwort.-
hi,
Gibt es die Möglichkeit, diese Kürzel unter WinXP zu ändern und für sich selbst anzupassen oder merkt ihr euch all diese eichen?
holla holla
-
Gibt es die Möglichkeit, diese Kürzel unter WinXP zu ändern und für sich selbst anzupassen oder merkt ihr euch all diese eichen?
diese "kürzel" sind die hexadezimalwerte der unicode-zeichen, warum sollte man die ändern wollen? oder versteh ich dich jetzt falsch?
-
hi,
diese "kürzel" sind die hexadezimalwerte der unicode-zeichen, warum sollte man die ändern wollen? oder versteh ich dich jetzt falsch?
Ich möchte sie für mich anpassen, ist mir ein wenig zuviel, alle Zeichen zu merken.
Z. B. möchte ich die „“ auf [ STRG+ALT+2 ] und [ STRG+ALT+3 ] haben, kann ich das selber festlegen?
holla holla
-
Moin!
diese "kürzel" sind die hexadezimalwerte der unicode-zeichen, warum sollte man die ändern wollen? oder versteh ich dich jetzt falsch?
Ich möchte sie für mich anpassen, ist mir ein wenig zuviel, alle Zeichen zu merken.
Z. B. möchte ich die „“ auf [ STRG+ALT+2 ] und [ STRG+ALT+3 ] haben, kann ich das selber festlegen?
http://aktuell.de.selfhtml.org/artikel/sonstiges/windows-tastaturlayout-anpassen/
- Sven Rautenberg
--
"Love your nation - respect the others."-
hi,
Ich möchte sie für mich anpassen, ist mir ein wenig zuviel, alle Zeichen zu merken.
http://aktuell.de.selfhtml.org/artikel/sonstiges/windows-tastaturlayout-anpassen/
Ich wusste doch, dass ich das irgendwo mal gesehen hatte, vielen Dank für den Link.
holla holla
-
hi,
http://aktuell.de.selfhtml.org/artikel/sonstiges/windows-tastaturlayout-anpassen/
Ich blick da gerade nicht durch, laut meiner Keyboard-Konsole habe ich ja alles sehr übersichtlich auf meiner Tastatur, in einem Texteditor wie Editpad funktionieren diese Kombinationan auch, nur nicht in einer Textarea, weiss jemand wie ich diese Kombinationen in meinem FF benutzen kann?
In Editpad funktioniert z. B. [ ALT Gr + z ] für „ und [ ALT Gr + u ] für “, warum funktioniert das nicht in der Textarea meines Browsers?
holla holla
-
-
-
-
-
-
Grüße,
noch eine idiotische Frage von mir - und wie gibt mans ein?
MFG
bleicher-
noch eine idiotische Frage von mir - und wie gibt mans ein?
� wobei 0000 durch den hexadezimalwert des unicodes zu ersetzen ist - oder war das eine andere frage?
-
Grüße,
� wobei 0000 durch den hexadezimalwert des unicodes zu ersetzen ist - oder war das eine andere frage?
jein - denn die forumsengine würde ja den & "&en" - wie man es HIER eingibt ist mir daher ein rätsel ;)
MFG
bleicher-
hi,
jein - denn die forumsengine würde ja den & "&en" - wie man es HIER eingibt ist mir daher ein rätsel ;)
Das ist das schöne an UTF 8, Copy&Paste ;)
holla holla
-
-
-
-
-
nein - ich meine die kästchen di edu hier abgebildet hast - ich wusste gar nciht, dass es diese zeichen ┌ ┐└ ┘ gibt^^ mehr info evtl.?
sag blos dir sagt extended ascii nix?
damals gabs irre viele games mit ascii-grafik, da waren solche zeichen essentiell - damals war irgend ein rougelike (leisure suit larry und test drive) mein erstes spiel - die spielfigur war so ein gelbes smilie-dinges ;) mann war da die grafik geil :D
-
-
Yerf!
┌───┐┌───┐┌───┐
│ 1 ││ 2 ││ 3 │
└───┘│ │└───┘
│ │┌───┐
└───┘│ 5 │
┌───┐ └───┘
│ 4 │┌───┐
└───┘│ 6 │
└───┘cool - wie geht denn das?
Mit CSS!
Hm, nachdem ich festgestellt hab, dass die meisten Leute wohl nicht verstehen werden was ich hier gemeint habe noch eine kleine Erklärung:
Der IE6 ist scheinbar nicht nur zu doof für float/clear, sondern auch für die hier genutzten Zeichen (hab ich aber erst gestern abend im Opera gemerkt).
Gruß,
Harlequin
PS: an dem Grund, weshalb die inline-Version nicht richtig geht werd ich noch forschen.
--
<!--[if IE]>This page is best viewed with a webbrowser. Get one today!<![endif]-->-
Moin!
┌───┐┌───┐┌───┐
│ 1 ││ 2 ││ 3 │
└───┘│ │└───┘
│ │┌───┐
└───┘│ 5 │
┌───┐ └───┘
│ 4 │┌───┐
└───┘│ 6 │
└───┘cool - wie geht denn das?
Mit CSS!
Der IE6 ist scheinbar nicht nur zu doof für float/clear, sondern auch für die hier genutzten Zeichen (hab ich aber erst gestern abend im Opera gemerkt).kann ich nicht sagen - meine IEs (5.5 und 6.0) stellen die Liniengrafik-Zeichen ohne weiteres dar. Deiner etwa nicht? Was hast du ihm angetan?
So long,
Martin--
Was du heute kannst besorgen,
das geht sicher auch noch morgen.-
Yerf!
kann ich nicht sagen - meine IEs (5.5 und 6.0) stellen die Liniengrafik-Zeichen ohne weiteres dar. Deiner etwa nicht? Was hast du ihm angetan?
Der IE6 hier auf dem anderen Rechner (mit XP) machts auch richtig. Vermutlich liegts am Windows 2000, das keinen passenden fixed-width Font für die Darstellung hat und deswegen auf einen anderen umstellt (die Darstellungsfehler kommen eindeutig daher, dass die Zeichen nicht gleich breit dargestellt werden[1]).
Gruß,
Harlequin
[1] und bei dem, was dabei herauskommt, fragt man sich wirklich, wie man *so etwas* auf einer Webseite erreicht...
--
<!--[if IE]>This page is best viewed with a webbrowser. Get one today!<![endif]-->
-
-
-
-
-
Yerf!
Kann man IEs irgendwie zu der gewünschten Darstellung bewegen?
Ja, allerdings funktioniert meine Lösung scheinbar nur im Quirksmode:
li { color: white; width: 42px; height: 42px; /*float: left;*/ margin: 4px; display: inline; vertical-align:top; }Womit meine Freude über display:inline-block wieder etwas gebremst ist. Ich dachte ich hätte das schon im Standardmode des IE gesehen...
Gruß,
Harlequin
--
<!--[if IE]>This page is best viewed with a webbrowser. Get one today!<![endif]-->-
Yerf!
Ja, allerdings funktioniert meine Lösung scheinbar nur im Quirksmode:
Hm, mit DIVs scheint das ganze zu gehen, muss ich mir nochmal näher ansehen, woran das liegt...
Gruß,
Harlequin
--
<!--[if IE]>This page is best viewed with a webbrowser. Get one today!<![endif]-->-
Yerf!
Ok, ich hab glaub ich die Lösung gefunden. Damit das im IE "richtig" geht muss den LIs erst ein display:inline-block zugewiesen werden, das später durch eine weitere CSS-Regel mit diplay-inline überschrieben wird (wtf?).
ul { margin: 0; padding: 0; list-style: none; width: 160px; } li { color: white; width: 42px; height: 42px; margin: 4px; display: inline-block; vertical-align:top; border:1px solid red; } * html li { display:inline; } #item2 { height: 72px; } #item1, #item4 { background: red; } #item2, #item5 { background: green; } #item3, #item6 { background: blue; }Allerdings musste ich die Breite von UL etwas anpassen.
Gruß,
Harlequin
--
<!--[if IE]>This page is best viewed with a webbrowser. Get one today!<![endif]-->-
Yerf!
Wieso kann man hier eigentlich keine Beiträge editieren? ;-)
Allerdings musste ich die Breite von UL etwas anpassen.
Das ist nicht notwendig, wenn man den zu Testzwecken eingebauten Border wieder entfernt...
Gruß,
Harlequin
--
<!--[if IE]>This page is best viewed with a webbrowser. Get one today!<![endif]--> -
@@Harlequin:
Ok, ich hab glaub ich die Lösung gefunden. Damit das im IE "richtig" geht muss den LIs erst ein display:inline-block zugewiesen werden, das später durch eine weitere CSS-Regel mit diplay-inline überschrieben wird (wtf?).
Cooooooool. Vielen Dank. Wie kommt man nur auf solchen Unsinn, der dann auch noch funktioniert?
In meinem 6er ist das allerdings nicht nötig; der begnügt sich mit der einmaligen Deklaration '
li {display: inline}'.7er reagiert nicht auf den Selektor '
* html li', aber auf '*+html li'.BTW, die zweimalige Deklaration in einer Regel '
*+html li {display: inline-block; display: inline}' funktioniert nicht; es müssen getrennte Regeln '*+html li {display: inline-block} *+html li {display: inline}' sein.Mein ergänztes Stylesheet sieht nun so aus (anstelle der bisherigen Regel für '
li'):li { color: white; width: 42px; height: 42px; float: left; margin: 4px; display: inline-block; /* IE 7 */ } * html li /* IE 6 */ { display: inline; float: none; vertical-align: top; } *+html li /* IE 7 */ { display: inline; float: none; vertical-align: top; }Live long and prosper,
Gunnar--
Erwebsregel 208: Manchmal ist das einzige, was gefährlicher als eine Frage ist, eine Antwort.-
Yerf!
Cooooooool. Vielen Dank. Wie kommt man nur auf solchen Unsinn, der dann auch noch funktioniert?
inline-block kam mir in den Sinn, weil ich schon länger in Fan davon bin, da es eben ein paar Probleme löst die man mit float so hat. Bisher war aber der FF noch ein kleines Problem (der 2er kan das nur über -moz-eigenschaft und nicht 100%ig)
Die Sache mit den Überschreiben der Eigenschaft beim IE hab ich dann durch Analyse des Beispiels und meiner Testfiles herausgefunden.
In meinem 6er ist das allerdings nicht nötig; der begnügt sich mit der einmaligen Deklaration '
li {display: inline}'.Der 6er hier (6.0.2800.1106 auf Win2k) wollte einfach nicht. Aber der stellt ja auch dein "Kunstwerk" aus dem Ausgangsposting falsch dar (die Zeichen haben da keine fixed width).
7er reagiert nicht auf den Selektor '
* html li', aber auf '*+html li'.Den 7er hab ich hier bei dem Test nicht weiter betrachtet, weil ich grad keinen zum testen da hatte.
BTW, die zweimalige Deklaration in einer Regel '
*+html li {display: inline-block; display: inline}' funktioniert nicht; es müssen getrennte Regeln '*+html li {display: inline-block} *+html li {display: inline}' sein.Das ist mir auch aufgefallen. Keine Ahnung was da intern im IE passiert...
Gruß,
Harlequin
PS: vielleicht sollt ich mal die ganzen Eigenheiten von inline-block mal in einem Artikel zusammenfassen...
--
<!--[if IE]>This page is best viewed with a webbrowser. Get one today!<![endif]-->-
@@Harlequin:
inline-block kam mir in den Sinn, weil ich schon länger in Fan davon bin, da es eben ein paar Probleme löst die man mit float so hat.
Ja, z.B. das nötige 'clear' nach jedem n. Item (in meinem Beispiel für #item4). Ist ja nicht wirklich schön, da bei jedem n. eine Klasse dafür ins HTML reinzuschreiben (lassen durch serverseitiges Script).
'
li:nth-child(3n+1) {clear: both}' geht schon in Opera und Safari, aber noch nicht im Firefox.Bisher war aber der FF noch ein kleines Problem (der 2er kan das nur über -moz-eigenschaft und nicht 100%ig)
Ja, da spiele ich auch gerade mit rum. '-moz-inline-block' tut’s nicht; '-moz-inline-box' sieht schon verheißungsvoller aus.
PS: vielleicht sollt ich mal die ganzen Eigenheiten von inline-block mal in einem Artikel zusammenfassen...
Mach ma’.
Live long and prosper,
Gunnar--
Erwebsregel 208: Manchmal ist das einzige, was gefährlicher als eine Frage ist, eine Antwort.-
Yerf!
Ja, da spiele ich auch gerade mit rum. '-moz-inline-block' tut’s nicht; '-moz-inline-box' sieht schon verheißungsvoller aus.
-moz-inline-stack exisiert ja auch noch, damit hatte ich bei letzten Tests halbwegs Erfolg.
PS: vielleicht sollt ich mal die ganzen Eigenheiten von inline-block mal in einem Artikel zusammenfassen...
Mach ma’.
"Mal schauen." Ich hab mir so einiges vorgenommen was ich eigentlich noch machen wollte, vor allem die Überarbeitung meiner Webseite...
Aber der Artikel wäre ja zumindest mal etwas, das für mehr Leute interessant ist, evtl. gibt mir das den nötigen Antrieb.
Gruß,
Harlequin
--
<!--[if IE]>This page is best viewed with a webbrowser. Get one today!<![endif]-->
-
-
-
-
-
-
-
Kann man IEs irgendwie zu der gewünschten Darstellung bewegen?
javascript in jedem dritten element den textfluss wiederherstellen ;)
oder nur elemente mit fixer höhe verwenden
-
hi,
Kann man IEs irgendwie zu der gewünschten Darstellung bewegen?
Hier könntest du ein „nur IE-Element“ einfügen ;
#ieclear { /* Hier müsste man noch ein wenig anpassen */ margin:0; padding:0; height:0; line-height:0; clear:both; float:none; }HTML:
<!--[if lt IE 7]> <li id="ieclear"></li> <![endif]-->Das ist Valide und überzeugt auch den IE.
Nur aus Neugier, wie steht es hier um die Semantik?
holla holla