この問題は、さまざまなブラウザーでのフォントのレンダリングに関連しています。この問題が Chrome でのみ再現されることに驚きました。Firefox、IE8、Safari、さらには IE6 でも問題なく動作します。
これがサンプルです。
そして、コード自体は次のとおりです。
<div style="position:absolute;bottom:2px;padding-top: 1px;width:100%;">
<span style="float:left;">
<div id="saveCustomizationButton" class="smallBlueButton">
<span>Speichern</span>
</div>
</span>
<span style="float:right;padding-right:1px;">
<div id="downloadOrPrintButton" class="smallGreenButton smallGreenButtonSmallLetterSpace">
<span>Downloaden oder drucken</span>
</div>
</span>
</div>
div.smallGreenButton span, div.smallGreenButton a {
display: block;
line-height: 14px;
padding: 1px 7px 2px 13px;
}
div.smallGreenButton {
font-family: arial,sans-serif;
font-size: 12px;
font-weight: 600;
}
div.smallBlueButton {
font-family: arial,sans-serif;
font-size: 12px;
font-weight: 600;
}
それだ。CSSのリセットについて読んで、試してみました。どんな奇跡でも何も変わらない。私が使用すると考えられていた別の方法は、コンテナー タグの幅を固定することでした。しかし、複数のローカリゼーションを維持する必要があるため、このアプローチは使用できません。
smb が解決策を提案してくれることを願っています。または、ブラウザ固有の動作を実装する必要があります。
あなたのコメントを待っています。前もって感謝します。