Blogger.comのCSSはChromiumとFirefox/Operaで見たときの動作が異なる/

Question

私はブロガーサイトでカスタムCSSを使用しています。 CSSが1つの投稿だけを尊重する場合、私はその投稿内にCSSコードを使用します。たとえば、詩の線をグラフィックの背景に合わせるために使用します。私はChromium（Linux Mint 18.1）を使用しているので、このブラウザを使用して結果を確認します。しかし、Firefoxで同じ公開された投稿を表示すると、CSSの配置はオフになります。

編集：Operaもチェックされていますが、Firefoxと同じように動作します（FirefoxとOperaは同じ方法でテキストを表示しますが、Chrome/Chromiumとは異なります）。

2つ（またはそれ以上）のブラウザがインストールされている場合は、両方でcheck out the postを使用できます。次のように

全体のポストコードは次のとおりです。 https://webmasters.stackexchange.com/questions/14324/font-displays-differently-in-firefox-vs-chrome/14347#14347

しかし、これはで解決することができるかどうかはわからない：

<div dir="ltr" style="text-align: left;" trbidi="on"> 
<div dir="ltr" style="text-align: center;" trbidi="on"> 
<div class="image"> 
<br /></div> 
<div class="image"> 
<a href="http://tsairi.deviantart.com/art/The-Birds-437529362" target="_blank"><img alt="the birds by tsairi final day poem by mozzribo" height="1808" src="https://i.imgur.com/hC2zfVe.png" title="The Birds by Tsairi − click for image source" width="434" /></a> 
<br /> 
<div class="text"> 
<span style="color: white;"> 
A seraph approached me last night<br /> 
Gave me a burning letter and flew away blazing<br /> 
As I broke the wax stamp a black phoenix fluttered before me<br /> 
It took me to the fractal spiral and shattered my body<br /> 
And with it all of my self-proclaimed sins<br /> 
The eternity that is to be was one and I was told that<br /> 
There is nothing to regret and there will never be<br /> 
If I should go through this scabrous wildwood again<br /> 
I would, just to live again that night when we met at the cemetery<br /> 
The bird sent me back to believe that there is nothing to regret<br /> 
Aye, there is nothing to regret<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
When the time comes for gentlemen Their ethics to deprave<br /> 
I’ll be standing in front of my children’s grave<br /> 
I’ll be asking with a brain gone illogically brave<br /> 
Where is my promised final day<br /> 
That has been taken from the grievous away<br /> 
Who will kindly grant it to me<br /> 
Where are the pages of Genesis Lost<br /> 
And who will pay the cost<br /> 
Where is my promised final day<br /> 
That has been taken from the grievous away<br /> 
Who will kindly grant it to me<br /> 
Where are the pages of Genesis Lost<br /> 
And who will pay the cost<br /> 
Better than my noose in the company of I to be tossed<br /> 
I to be tossed<br /> 
Who will kindly stand in front of me and say<br /> 
"There is still a cigarette to finish in the ashtray."<br /> 
</span> 
</div> 
</div> 
</div> 
<style> 
.image { 
position:relative; 
float:center; /* optional */ 
} 
.image .text { 
position:absolute; 
color: black; 
text-shadow: 0px 0px 5px rgba(0, 0, 0, 1); 
font-size: 11pt; 
top:10px; /* in conjunction with left property, decides the text position */ 
margin-top:650px; 
left:39px; 
width:783px; /* optional, though better have one */ 
} 
</style><br /></div> 

私は、次の回答で問題を引き起こしているように見えるものを見つけすべて。ブラウザにテキストを他と同じように表示させる方法はありますか？

CSSをすべてのブラウザで同じように動作させるにはどうすればよいですか？

Answer 1

ブラウザのキャッシュを最初にクリーンアップし、ブラウザを更新します。両方のブラウザでChromeとFirefoxの両方がうまく動作していることを確認します。なぜこれらのbrタグを何度も何度も繰り返し使用すると、マージンが上になり、あなたの利益が上がります