0

最初..これを修正するにはどうすればよいですか： http://jsfiddle.net/kLjcq/

これはブラウザで適切にフォーマットされています..!

しかし、フィデルでは物事が台無しになります.. :(何が起こったのですか?どうすればこれを修正できますか?

2番目は..長い文字列がある場合...「Reading from xml...」という見出しの明るい灰色の境界線を越えて撮影されます

私が探しているのは、このテキストの最大スプレッドがその境界線まで続くことです..その後..次の行に分割されます..テキストが適切に囲まれるように..

div.content 内

div.content {
    background-color: #add8e6;
    display:inline-block;
    margin-top: 20px;
    border-radius: 10px;
    position: relative;
    top:-5px;
}

制限などを追加しようとしましたが、青いボックスをピクセル値に制限しますが、代わりにテキスト（および青いボックス）を特定の制限まで制限した後、新しい行に分割します...手がかり. ありがとう

4

2 に答える 2

0

絶対配置を使用しているため、フィドルが壊れています。画面が狭い場合、チェックリスト内の要素は折り返されますが、後続の要素は、前の要素が 2 行ではなく 1 行だけであることを想定して配置されます。

2 番目の質問に関連する実際のマークアップがなければ、実際の問題が何であるかを推測することしかできません。ただし、pre提供されたサンプルで使用しているため、犯人はおそらくそこにあります。必要なのは、次のようなプロパティを追加することです。

white-space: pre-wrap

このプロパティがない場合、pre タグは通常、要素をワードラップすることを許可しません。これにより、すべてのテキストを表示するために可能な限り多くの水平方向のスペースが必要になります。

于 2013-02-07T21:57:56.847 に答える
0

あなたは絶対に.checksheetクラスを位置づけています。これにより、ドキュメント フローから削除されます。-classのような他の要素.contentは気にしません。

このコンテキストで使用する理由はわかりませんがposition: absolute;、間違いを引き起こしています。

于 2013-02-07T21:50:50.993 に答える