2017-10-27 9 views
1

Safari 11で次のような問題が発生しました。bodyタグを閉じる前にスタイルを配置したときにSafariブラウザがテキストの位置を正しく再ペイントまたは再計算しません。問題の原因 これらのスタイル:Safari 11テキストセンターと文字間隔の問題

h1 { 
    letter-spacing: .2em; 
    text-align: center; 
} 

あなたはここに例を見ることができました。 Safariでテキストをクリックすると、テキストが再配置されます。テキストを正しく配置するための回避策はありますか?

http://jsfiddle.net/rauot9tq/3/又は下記画像に http://jsfiddle.net/rauot9tq/4/

、そこ置き忘れテキストが最初の行にあり、2行目にそれをクリックしたときに倍増:

enter image description here

答えて

0

に対する答えがこの問題はSafariに強制的にコンテンツを再レンダリングさせることです。純粋なcss溶液は、例えば、

body { 
    display: none; 
} 

とフッターに:に<head>要素でスタイルを設定するには、ここ

body { 
    display: block; 
} 

が働いフィドル更新されます。http://jsfiddle.net/rauot9tq/10/


別soulutionを再描画するのSafariを強制することができJSを使用して:

document.querySelector('body').style.display = 'none'; 
document.querySelector('body').offsetWidth; 
document.querySelector('body').style.display = 'block'; 

JS溶液でフィドル:http://jsfiddle.net/rauot9tq/11/