LinkBack URL
About LinkBacks
ZitierenIch würde statt des prozentualen Wertes "em" verwenden. Ist auch eine relative Angabe.
Hi Leutz!
Ich arbeite eigentlich schon eine ganze Weile mit CSS, doch manchmal überraschen mich auch noch Browser mit ihrem zeitweise seltsamen Verhalten. Diesesmal Opera.
Gegeben sei der folgende HTML und CSS Code:
Der Div-Kasten wird in FF 3.0.1 und Opera 9.51 unterschiedlich breit dargestellt (IE6 hat Verhalten von FF). Ohne die font-size Anweisung beim div wird in beiden Browsern der Kasten gleich breit angezeigt.HTML-Code:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Width Test for Opera</title> <style type="text/css" media="screen"> html, body, div, p { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; } body { line-height: 1em; color: black; background: white; font-family: Arial, Helvetica, sans-serif; } div { font-size: 0.8em; /* <-- Hier liegt die Krux */ width: 44.5em; border: 1px solid green; margin: auto; margin-top: 5em; } </style> </head> <body> <div> <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam iaculis nisl quis metus. Donec et tellus eu purus iaculis consectetuer. Nunc volutpat arcu quis diam. Fusce sit amet leo. Sed pretium neque nec felis. Donec sed pede. Integer sed erat. Nulla facilisi. Phasellus nunc ligula, malesuada non, ornare ut, facilisis non, urna. Quisque venenatis dui. Aliquam dictum, lacus ac tincidunt aliquam, risus massa consectetuer justo, id sagittis sapien mi a est. Integer tincidunt. Maecenas dictum sapien nec neque. Duis leo. Vivamus posuere. Duis tellus purus, ornare non, semper nec, placerat ac, massa.</p> </div> </body> </html>
Wie bringe ich Opera dazu die font-size gleich wie FF zu interpretieren?
Flexible und barrierefreie Layouts werden sonst recht schwierig, oder?
Danke & Grüße,
Fred
Geändert von freddymc (24.07.2008 um 00:02 Uhr)
Ich würde statt des prozentualen Wertes "em" verwenden. Ist auch eine relative Angabe.
Wenn ich statt "100%" "1em" schreibe bleibt das Ergebnis das gleiche. 100% sollte eigentlich meistens 1em entsprechen.
Moin Freddy,
Jap, bei den früheren Versionen von Opera gabs mit 100% mal nen Bug. Vlt. ist der da irgendwie auch da...Versuchs mal mit 100.1% oder 100.01%Zitat von freddymc
Dieser Bug ist schon sehr lange bekannt und kann einfach gefixt werden mit font-size 100.01% für body
“My software never has bugs. It just develops random features ...”
» DevShack - die Website des freien Webentwicklers Boris
Das ist auch ein faules Pack bei OperaDieser Bug ist schon sehr lange bekannt und kann einfach gefixt werden mit font-size 100.01% für body
Hm, genau das habe ich auch schon versucht - ohne Erfolg.Dieser Bug ist schon sehr lange bekannt und kann einfach gefixt werden mit font-size 100.01% für body
Hab's gerad nocheinmal versucht: der Kasten ist in Opera breiter.
Bin ich auf einmal zu bescheuert?
Kann einer von euch ein funktionierendes Mini-Beispiel posten; ware klasse!
Fred
Stell doch mal dein nicht funktionierendes Mini-Beispiel online
“My software never has bugs. It just develops random features ...”
» DevShack - die Website des freien Webentwicklers Boris
Passenden Webspace hab ich grad nicht zur Hand daher das File im Anhang. Hat sich aber gegenüber oben nicht viel verändert...
Danke & Grüße,
Fred
Moin
lies dir mal diese Seite durch...Vlt. hängt es damit zusammen
Was helfen könnte: Gib der Schrift mal eine Größe von 0.81em
Diese Beispiele habe ich mir auch mal runtergeladen und getestet. Kurioserweise wird der Kasten in Opera troz des "Hacks" zu hoch angezeigt.
Mit .81em werde ich weiter experimentieren es ist jedoch besserung in Sicht. Der Breitenunterschied von Div's macht nur noch ca. 2px aus. Das sind leider 2px zu viel...
Grüße,
Fred
Geändert von freddymc (24.07.2008 um 13:01 Uhr)
Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)
