1

コンテンツをページの中央に配置するためのコンテナを作成しましたが、段落タグがコンテナdivの外に続き、自動的に折り返されないという問題があります。私はいつもコンテナがラップで機能することを発見しました、そして私はこれで問題を抱えたことはありません。

.container { width: 1000px; margin: 0 auto; }

これは、div.container要素から浮かぶHTMLです。

<div class="container">
    <p>TestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTest</p>
</div>
4

2 に答える 2

6

問題は、内部のテキストが<p>スペースのない単語であるため、次のルールでワードラップを強制できることです。

.container {
  word-wrap: break-word; /* Forces to wrap the word and cut it*/
  width: 1000px;
  margin: 0 auto;
}

これは古いブラウザでは機能しないので注意してください。別のアプローチは、overflow: hidden属性を使用して拡張テキストを非表示にすることです。

于 2013-01-24T13:42:47.017 に答える
0

これらのプロパティを追加します。

overflow:hidden;
word-wrap: break-word;

幅を100pxに設定したフィドルの作業へのリンクはこちらです。

于 2013-01-24T13:42:30.807 に答える