3

ここに、デバッグしようとしている問題のデモを少し載せました：http: //jsfiddle.net/bvDBb/7/。

テキストインデントは、Chrome、Firefox、Operaで期待どおりに（または少なくとも期待どおりに）機能します。テキストの最初の行をインデントしてから、パディングを正しく保つために再度折り返しを実行します。

ただし、Safari（OS X 10.7.4では5.1.7）で表示すると、テキストを折り返す代わりに、水平スクロールバーが作成され、最初の行が右に移動します。十分な大きさのインデントを使用すると、行の一部が取得されます。非表示になっているので、スクロールして表示する必要があります。

それはSafariのバグですか、それとも他のブラウザがそれをサポートしているのは幸運ですか？

編集：

テキストの周りにアラウンドを追加するというKeithのアイデアは<p></p>レイアウトを修正するので（少なくともSafariでは、WinでFFを試していません）、質問は次のようになります：正しい動作とその理由は何ですか？

4

4 に答える 4

0

overflow-x:hidden;下 overflow-y:auto;に追加してみてください .content

于 2012-05-31T19:57:16.040 に答える
0

text-indentこのようなテキストインデントには、実際の CSS プロパティを使用する必要があります。そのような：

<div class="contentWrapper">
  <div class="content" style="text-indent: 100px;">
    <img src="image.jpg" alt="some image" />
    <p class="indent-me">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec porta mattis lectus, in fringilla magna posuere vitae.</p>
  </div>
</div>​

p.indent-me {
  text-indent:30px;
}
于 2012-05-31T20:22:54.447 に答える