nicht angemeldet
Unterschiedliches verhalten FF/IE
Ja, ich weiß, der Titel sagt nicht viel, aber ich wusste nicht wie ich beschreiben sollte. Es ist so: Dieser Code
HTML
<div id="header"> <table border="0" cellpadding="0" cellspacing="0" class="headertable"> <tbody><tr><td> <h1 class="blogtitle">limeblog</h1> <br /> <span class="blogsubtitle">limoniger geht's nimmer</span> </td></tr></tbody></table> </div>
CSS
#header { background-color: #222222; height: 120px; }
#header .headertable { width: 685px; height: 120px; margin: 0px auto 0px auto; border: 1px #FF0000 solid; }
#header .headertable td { text-align: right; vertical-align: bottom; }
#header .headertable td h1.blogtitle { font-size: 36px; font-weight: normal; color: #c5d551; display: inline; padding: 0px; margin: 0px; }
#header .headertable td .blogsubtitle { font-family: Verdana, Arial, sans-serif; font-size: 12px; color: #979797; }
Sieht in Firefox so aus: http://www.bombach.info/luke/blogage/layouts/lime/lime-ff.gif
und im Internet Explorer (6) so: http://www.bombach.info/luke/blogage/layouts/lime/lime-ie.gif
Woran liegt das? Was kann ich tun damit es gleich aussieht?
Grüße, Luke
-
Hallo,
HTML
Uiuiui, warum erzeugst du so viel Markup, wenn du nur eine simple überschrift erstellen möchtest? Ein <h1> mit einem <span> darin würde genügen um mit CSS den gewünschten Effekt zu erreichen.
Woran liegt das? Was kann ich tun damit es gleich aussieht?
Warum ist es so ein großes Problem? Vermutlich verwenden die beiden Browser unterschiedliche Angaben für line-height.
Gruß;
-
Uiuiui, warum erzeugst du so viel Markup, wenn du nur eine simple überschrift erstellen möchtest?
Weil ich die Überschrift rechtsbündig an dieser Position haben möchte, so dass wenn man die Länge der Überschrift ändert sie sich nach links ausdehnt. Das ginge wohl auch ohne die Tabelle mit padding oder margin, aber so kann die Überschrift sogar 2 Zeilig sein und es sähe noch gut aus.
Warum ist es so ein großes Problem?
Weil es wirklich gleich aussehen soll, ist für einen Bloganbieter den befreundete Studenten starten wollen
Vermutlich verwenden die beiden Browser unterschiedliche Angaben für line-height.
Dachte mir sowas...
-
Hallo,
Weil ich die Überschrift rechtsbündig an dieser Position haben möchte, so dass wenn man die Länge der Überschrift ändert sie sich nach links ausdehnt. Das ginge wohl auch ohne die Tabelle mit padding oder margin, aber so kann die Überschrift sogar 2 Zeilig sein und es sähe noch gut aus.
Das geht auch ganz einfach, wenn du dem <h1> text-align: right; gibst.
Weil es wirklich gleich aussehen soll, ist für einen Bloganbieter den befreundete Studenten starten wollen
Gerade dann wäre sauberes Markup besser. Ich habe dir gerade einen Hinweis gegeben, wie du es besser machen könntest. Nutze die Chance :-)
Dachte mir sowas...
Warum hast du's dann nicht ausprobiert?
Gruß;
-
Das geht auch ganz einfach, wenn du dem <h1> text-align: right; gibst.
Dann ist es aber nicht an der gewünschten vertikalen position, was ich afaik mit padding oder margin lösen müsste, was wiederum bedeuten würde dass wenn die Zeile überschritten würde, der folgende text nach unten, und nicht wie bei der tabelle mit vertical-align, nach oben gedrückt würde, das sähe dann scheisse aus. Die Lösung mit der tabelle ist zugegebener maßen unschön, aber ich dachte wenn man dadurch bewirken könnte dass sowohl überschrift als auch untertitel überlang sein könnten, wäre es legitim.
»»»»Dachte mir sowas...
Warum hast du's dann nicht ausprobiert?
Hatte nur so ne Ahnung als ich "Woran liegt das?" schrieb, ich hätte es direkt ausprobieren sollen, war blöd von mir ok. Dachte halt aber auch wenn's daran liegt kann man's nicht so einfach beheben da wenn man die line heigt erhöht, wachsen die abstände auch in beiden browsern und man müsste sogar auf ein eigenes IE-CSS ausweichen. Hoffte jemand käm mit irgend ner besseren lösung die vielleicht schon für dieses problem bekannt sei. Aber wie der Teufel so will kann ich an der line-height rumspielen und für mich noch unverständlicherweise ändert sich dadurch im firefox nichts. Hm
-
Allerdings ist ja auch der Abstand zwischen Überschrift und Untertitel in den beiden Browsern unterschiedlich, das bekomm ich nicht mit line-height ausgemerzt. Hat da jemand ne Idee? Ne bessere als verschieden CSSs machen?
-
Hi,
Allerdings ist ja auch der Abstand zwischen Überschrift und Untertitel in den beiden Browsern unterschiedlich, das bekomm ich nicht mit line-height ausgemerzt.
Logisch, hier geht es ja auch um margin!
Wenn Du einheitliche Abstände haben willst, warum gibst Du sie dann nicht einfach an, sondern überläßt das den Voreinstellungen der Browser?freundliche Grüße
Ingo
-
-
-
-
-