|
|||
IE Problem: h3 mehr abstand links
Nabend Community
Ich habe mal ein klitzekleines Problem im IE (5.x und 6) Problem: Im Contenteil habe ich eine Überschrift und eine -Box, die untereinander so angelegt wurden, dass sie wie eine kleine Tabelle aussehen mit 2 Zeieln und jeweils 1 Spalte sozusagen. Im IE auf der Höhe des Menus tritt ein komischer Fehler auf: Die P-Box fängt ca. 2px zu weit rechts an (siehe Link). Ich müsste der Überschrift eine Größenangabe zuweisen, damit das normal klappt, jedoch würde ich gerne wissen, wieso das zusande kommt? Link zum Problem Danke für die Hilfe
__________________
>> Linux is like a wigwam: no windows, no Gates, Apache inside. << |
Sponsored Links |
|
|||
Bin ja nicht der erste, der hier reinschaut und nicht der erste, der keine Lösung für dieses seltsame Verhalten weiß obwohl ich ziemlich lange daran rumgemacht habe.)
Poste trotzdem mal, damit du weißt, dass dieser Thread nicht vergebens ist. Das Problem betrifft ja nur das erste Auftauchen von p im #inhalt, alle anderen ( habe welche hinzugefügt) zeigen dieses Verhalten nicht. Was meinst Du mit Überschrift Größenangabe, damit das klappt?? Width? Habe probeweise p mal eine width ( 518px nach meiner Rechnung) mitgegeben, der FF zeigts richtig an, beim IE hats nix verändert, was den Einzug angeht, dafür springt p nach unten und das erste h3 wird erst beim Überfahren sichtbar.... probiers aus. Sehr merkwürdig, das. Vielleicht hilft Dir ( oder jemand anderen) das weiter. grüsse andir
__________________
Grüsse Andreas- auch mal wieder da... Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams) Wiedergelesen: > hier und hier [Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte |
Sponsored Links |
|
|||
Einfach mal ge"pell"t den CODE posten
siehe wie hier http://www.xhtmlforum.de/viewtopic.php?t=1399 Und nur die Stellen die es betrifft, dabei wird es sich lösen.......
__________________
</ulle> |
|
|||
Vielen Dank andir, ist nett von dir
Das "Problem" tritt nur auf der Höhe des Menus auf, wenn man den Inahlt des Menus erweitert, sind auch die restlichen Boxen davon betroffen @ulle: sorry, wusste ich nicht: Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="de"> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <style type="text/css"> * {margin:0; padding:0; border:none} body, html {height:100%; text-align:center} div {text-align:left; font:.9em Verdana, Arial, sans-serif; color:#fff} h1 {font-size:1.1em; color:black} h3 {font-size:.97em; color:red; background:#EEE; border:1px solid #000; border-bottom:none !important; line-height:25px} div#container {width:700px; margin:0 auto; background:#900} div#kopf {height:100px; background:black} div#menu {float:left; width:140px} div#inhalt {background:#FFF; margin-left:160px; padding:10px} p.box {background:#666; border:1px solid #000; height:90px; padding-top:5px; margin-bottom:20px} </style> <title>Beispieldatei</title> </head> <body> <div id="container"> <div id="kopf">Header</div> <div id="menu"> Menu</p> Menu</p> Menu</p> Menu</p> Menu</p> Menu</p> </div> <div id="inhalt"> <h1>Fehler im IE</h1> <h3>Box A</h3> <p class="box"> Ganz unauffällig konnte ich so Deine schlanken Ober- und Unterlängen studieren und den Anblick Deiner zierlichen Füsschen und Serifen geniessen.Nach einer gewissen Laufweite fasste ich mir ein Herz, Dich zueinem Zwiebelfisch-Imbiss einzuladen. </p> <h3>Box B</h3> <p class="box"> Ganz unauffällig konnte ich so Deine schlanken Ober- und Unterlängen studieren und den Anblick Deiner zierlichen Füsschen und Serifen geniessen.Nach einer gewissen Laufweite fasste ich mir ein Herz, Dich zu einem Zwiebelfisch-Imbiss einzuladen. </p> </div> </body> </html>
__________________
>> Linux is like a wigwam: no windows, no Gates, Apache inside. << |
|
|||
Ich habe mal in deinem Quelltext gespielt; wenn du die Inhalts-Box auch floatest, tritt der Fehler nicht mehr auf. Warum das so ist? Frag M$
An diesen Bug hattte ich zuerst gedacht; der Fix blieb aber wirkungslos. Die padding-/und margin-Werte hab' ich anders verteilt, damit's auch im IE5 passt. Getestet habe ich in FF, IE 5.0, 5.5, 6, Opera 6+7, alles WinXP SP1 Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="de"> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <style type="text/css"> * {margin:0; padding:0; border:none} body, html {height:100%; text-align:center; background-color:#fff; color:#000;} div {text-align:left; font:.9em Verdana, Arial, sans-serif; color:#fff;} h1 {font-size:1.1em; color:black;} h3 {font-size:.97em; color:red; background:#EEE; border:1px solid #000; border-bottom:none !important; line-height:25px;} #container {width:700px; margin:0 auto; background:#900;} #kopf {height:100px; background:black;} #menu {float:left; width:140px;} #inhalt {background:#FFF; /*margin-left:160px;*/ float:right; width:540px; padding:10px 0;} #inhalt h1, #inhalt h3, #inhalt p {margin-left:10px; margin-right:10px;} .box {background:#666; border:1px solid #000; height:90px; padding-top:5px; margin-bottom:20px;} .clear {clear:both;} </style> <title>Beispieldatei</title> </head> <body> <div id="container"> <div id="kopf">Header</div> <div id="menu"> Menu</p> Menu</p> Menu</p> Menu</p> Menu</p> Menu</p> </div> <div id="inhalt"> <h1>Fehler im IE</h1> <h3>Box A</h3> <p class="box">Ganz unauffällig konnte ich so Deine schlanken Ober- und Unterlängen studieren und den Anblick Deiner zierlichen Füsschen und Serifen geniessen.Nach einer gewissen Laufweite fasste ich mir ein Herz, Dich zueinem Zwiebelfisch-Imbiss einzuladen. </p> <h3>Box B</h3> <p class="box">Ganz unauffällig konnte ich so Deine schlanken Ober- und Unterlängen studieren und den Anblick Deiner zierlichen Füsschen und Serifen geniessen.Nach einer gewissen Laufweite fasste ich mir ein Herz, Dich zu einem Zwiebelfisch-Imbiss einzuladen. </p> </div> <br class="clear"> </div> </body> </html> Grüße fricca |
|
|||
Sehr schön, vielen Dank
Die Bugs bin ich auch schon rauf und runter gegangen
__________________
>> Linux is like a wigwam: no windows, no Gates, Apache inside. << |
|
|||
Jo, das fehlende /div hatte ich beim validieren lassen auch gesehen, aber einer Problemlösung bin ich dadurch nicht nähergekommen.
Der Code war ja nun auch einfach genug. So wie friccas Lösung das angeht, gehts natürlich. Eine Erklärung für das seltsame Verhalten des IE gibts aber immer noch nicht. Hm. grüsse andir
__________________
Grüsse Andreas- auch mal wieder da... Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams) Wiedergelesen: > hier und hier [Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte |
|
||||
Der 3px Abstandsbug vom IE ist echt nervig - denn manchmal funktioniert ein Fix, bei einem anderen Szenario funktioniert der gleiche nicht und man muss einen anderen ausprobieren (es gibt ja mehrere Ansätze).
Echt zum §$%&! ...
__________________
“My software never has bugs. It just develops random features ...” » DevShack - die Website des freien Webentwicklers Boris Bojic |
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Problem mit margin-left | Shyne | CSS | 7 | 03.03.2008 19:02 |
Font der Überschrift ändern (Problem) | artist | CSS | 2 | 07.12.2007 11:01 |
Design zu CSS/HTML verarbeiten - Problem häufen sich. | Grafikamateur | CSS | 2 | 06.08.2007 10:57 |
Problem bei Div's - zwei mal das gleiche und doch nicht ... | Niriel | CSS | 10 | 09.06.2005 18:39 |
Problem mit einem CSS Layout | nARC | CSS | 20 | 21.05.2005 07:28 |