mac float:right bug / font-size größer als Win
blub
- css
0 Der Martin0 Joachim
hallo
meine Seite wird in allen Browsern korrekt angezeigt. Nur auf MAC's werden zwei Pfeilsymbole um einen Absatz nach unten verschoben.
Der Link steht jeweils unter einem Text (Text hat float:right;), der Link hat ebenfalls float:right;
Habe rausgefunden, dass FF bei Mac automatisch einen Absatz erstellt, sobald man den darunter stehenden Link floated !? bei allen anderen Browsern auch unter Win ist das nicht so...
das ist schonmal ziemlich nervig, aber das eigentliche Problem ist glaube ich die Bildschirmauflösung beim Mac oder die Unterschiedliche Darstellung der font-size.
Beim Mac scheint der selbe Text größer zu sein, deshalb hat Mac einen Absatz mehr als Win und der Link wird verschoben.
kann jemand bitte helfen? bin total am durchdrehen :)
...habe statt "px" schon "pt" oder "em" ausprobiert und auch in den body: font-size: 100,01% geschrieben (hab zwar kein plan was das bringen soll...auch irgendwo gelesen..)
Hi,
meine Seite wird in allen Browsern korrekt angezeigt. Nur auf MAC's werden zwei Pfeilsymbole um einen Absatz nach unten verschoben.
das wird uns ohne relevanten Quellcodeauszug, noch besser ein Online-Beispiel zum Untersuchen, wohl kaum weiterhelfen.
Der Link steht jeweils unter einem Text (Text hat float:right;), der Link hat ebenfalls float:right;
Wenn beide Elemente floaten, würde man eher erwarten, dass sie nebeneinander stehen, nicht untereinander. Es sei denn, sie sind so breit, dass sie nicht mehr nebeneinander passen.
Habe rausgefunden, dass FF bei Mac automatisch einen Absatz erstellt, sobald man den darunter stehenden Link floated !? bei allen anderen Browsern auch unter Win ist das nicht so...
Hä?
das ist schonmal ziemlich nervig, aber das eigentliche Problem ist glaube ich die Bildschirmauflösung beim Mac oder die Unterschiedliche Darstellung der font-size.
Beim Mac scheint der selbe Text größer zu sein, deshalb hat Mac einen Absatz mehr als Win und der Link wird verschoben.
Das ist aber kein Win/Mac-Problem; das Problem wird dich immer treffen. Früher oder später. Denn du kannst nie genau sagen, wie groß eine Schrift beim Nutzer angezeigt wird. Selbst wenn du eine Schriftgröße in px angibst, können sich durch unterschiedliche Proportionen der Schriften immer kleine Abweichungen ergeben - ganz zu schweigen davon, dass du immer damit rechnen musst, dass ein Nutzer die Schrift mal etwas größer oder etwas kleiner einstellt.
kann jemand bitte helfen? bin total am durchdrehen :)
Hilf uns, dir zu helfen, indem du die nötigen Informationen zur Verfügung stellst. Dann können wir weitersehen.
...habe statt "px" schon "pt" oder "em" ausprobiert und auch in den body: font-size: 100,01% geschrieben (hab zwar kein plan was das bringen soll...auch irgendwo gelesen..)
Einfach wahllos irgendwas probieren, ist selten eine gute Idee. Nachher sieht's zufällig (bei dir!) so aus wie gewünscht, und du glaubst, das Problem gelöst zu haben.
So long,
Martin
Om nah hoo pez nyeetz, Martin!
F: Was ist schneller: Das Licht oder der Schall?
A: Offensichtlich der Schall. Wenn man den Fernseher einschaltet, kommt immer erst der Ton, und dann erst das Bild.
F: Was ist schneller: Das Licht oder der Schall?
A: Offensichtlich das Licht. Wenn man das Radio einschaltet, kommt immer erst das Licht und dann der Ton.
Matthias
ok hätte den code gleich angeben sollen..
hoffe ihr könnt damit etwas anfangen:
wie gesagt auf Win alles top, nur auf Mac springt der Link um einen Absatz nach unten und sitzt somit auf der Trennlinie...
Danke für die Hilfe!
<div class="right">
<div class="box_tx">
<h4>XXX – lorem ipsum dolor</h4>
xxx-Xxxxxxxxxxxxx xxxx xxxxxxxxxx xxxxxxxxxxx xxx xxxxxxxxxx
xxxxx, xx xx xxxxxxxxxxxxxxxx xxxx xxxxxxxxxxxxx xxxxxxxxxxxx, xx
xxxxxxxxxx, xxxx xxxx xxxxxxxx xxxxxxxxxxx xxxxxxxxxxx xxxxxxxxxxx
xx xxx xxxxxxxxxxxxxxx xx xxxxxx xxx xx xxx xxxxxxxxx xxxxxxxx
xxxxxxxx xxxx, xxxx xxx xxxxx xxxx xxxxxxxxxxx.
<p class="clear"><br></p>
<a href="xxx_xxx_xxxxxx_xxxxxxxx.php?subnav=xxx_xxxxxxx"
OnMouseOut="na_restore_img_src('image1', 'document')" OnMouseOver="na_change_img_src('image1', 'document', 'img/weiter_button_h.jpg', true)"><img name='image1' src="img/weiter_button.jpg" alt="Weitere Informationen..." title="Weitere Informationen..." class="weiter_button"></a>
</div>
</div>
<div class="border" style="margin-top: 16px; margin-bottom: 16px;"></div>
und noch die css:
.right {
float:right;
width: 480px;
}
.box_tx {
display:block;
padding-bottom: 16px;
margin-left: 16px;
margin-right: 16px;
font-size: 12px;
line-height: 20px;
}
.clear {
clear:both;
}
.weiter_button {
float:right;
}
.left {
width: 480px;
}
.border_right {
border-right: 1px dashed #80c9c7;
}
ok hätte den code gleich angeben sollen..
hoffe ihr könnt damit etwas anfangen:
wie gesagt auf Win alles top, nur auf Mac springt der Link um einen Absatz nach unten und sitzt somit auf der Trennlinie...
Danke für die Hilfe!
<div class="right">
<div class="box_tx">
<h4>XXX – lorem ipsum dolor</h4>
xxx-Xxxxxxxxxxxxx xxxx xxxxxxxxxx xxxxxxxxxxx xxx xxxxxxxxxx
xxxxx, xx xx xxxxxxxxxxxxxxxx xxxx xxxxxxxxxxxxx xxxxxxxxxxxx, xx
xxxxxxxxxx, xxxx xxxx xxxxxxxx xxxxxxxxxxx xxxxxxxxxxx xxxxxxxxxxx
xx xxx xxxxxxxxxxxxxxx xx xxxxxx xxx xx xxx xxxxxxxxx xxxxxxxx
xxxxxxxx xxxx, xxxx xxx xxxxx xxxx xxxxxxxxxxx.
<p class="clear"><br></p>
<a href="xxx_xxx_xxxxxx_xxxxxxxx.php?subnav=xxx_xxxxxxx"
OnMouseOut="na_restore_img_src('image1', 'document')" OnMouseOver="na_change_img_src('image1', 'document', 'img/weiter_button_h.jpg', true)"><img name='image1' src="img/weiter_button.jpg" alt="Weitere Informationen..." title="Weitere Informationen..." class="weiter_button"></a>
</div>
</div>
<div class="border" style="margin-top: 16px; margin-bottom: 16px;"></div>
und noch die css:
.right {
float:right;
width: 480px;
}
.box_tx {
display:block;
padding-bottom: 16px;
margin-left: 16px;
margin-right: 16px;
font-size: 12px;
line-height: 20px;
}
.clear {
clear:both;
}
.weiter_button {
float:right;
}
.left {
width: 480px;
}
.border_right {
border-right: 1px dashed #80c9c7;
}
Hi,
Habe rausgefunden, dass FF bei Mac automatisch einen Absatz erstellt, sobald man den darunter stehenden Link floated !?
Das ist Unfug. FF am Mac verhält sich in fast allen Belangen wie sein PC-Kollege.
Gruesse, Joachim
@@Joachim:
nuqneH
Das ist Unfug. FF am Mac verhält sich in fast allen Belangen wie sein PC-Kollege.
Dennoch werden dieselben Schriftarten in denselben Schriftgrößen auf Mac vs. PC unterschiedlich gerendert.
Für wen das ein Problem darstellt, der hat schonmal was grundlegend falsch gemacht.
Qapla'
Hi Gunnar,
Dennoch werden dieselben Schriftarten in denselben Schriftgrößen auf Mac vs. PC unterschiedlich gerendert.
Selbstverständlich. Aber das...
"dass FF bei Mac automatisch einen Absatz erstellt"
... gehört wahlweise in den Bereich Fiktion oder Fehlinterpretation.
Für wen das ein Problem darstellt, der hat schonmal was grundlegend falsch gemacht.
So gern ich es ja täte, aber da kann ich Dir nicht widersprechen ;-)
Gruesse, Joachim
@@Joachim:
nuqneH
Dennoch werden dieselben Schriftarten in denselben Schriftgrößen auf Mac vs. PC unterschiedlich gerendert.
Selbstverständlich. Aber das...
"dass FF bei Mac automatisch einen Absatz erstellt"
... gehört wahlweise in den Bereich Fiktion oder Fehlinterpretation.
Vermutlich in letzteren. Ich vermute wie schon [Der Martin], dass beim Mac die Schrift breiter ist und dadurch floatende Elemente nicht nebeneinander passen, sondern untereinander dargestellt werden, was blub als „automatisch einen Absatz erstellt“ fehlinterpretiert.
Aber da blub alias neuhier alias mac nicht nur den Abschnitt „Keine Doppelpostings“ in der Charta missachtet, sondern auch den Abschnitt „Tips für Fragende“, werden wir das wohl nie erfahren.
Und es ist mir auch sch^Wegal.
Qapla'
Ena koe!
Das ist Unfug. FF am Mac verhält sich in fast allen Belangen wie sein PC-Kollege.
Dennoch werden dieselben Schriftarten in denselben Schriftgrößen auf Mac vs. PC unterschiedlich gerendert.
Für wen das ein Problem darstellt, der hat schonmal was grundlegend falsch gemacht.
Richtig. Der Fehler besteht darin, ein Telefon zu haben, vermöge dessen der Designer sich darüber beschweren kann, daß die Schrift beim Kunden (also im IE 6 auf Win 2000, mit viel Glück im FF 3.0 auf Win XP) dünner aussieht als in seinem Template, das er mit Photoshop auf dem Mac erstellt hat.
Besonders unerbaulich wird die Debatte in dem Moment, in dem der Designer merkt, daß der Browser nicht nur falsche™ Kantenglättung anwendet, sondern auch noch Arial statt Kostenpflichtiger-Helvetica-Klon-der-genauso-aussieht-wie-Arial-und-in-dem-einige-relevante-Unicode-Zeichen-fehlen.
Seufz.
Viele Grüße vom Længlich