30

こんにちは、CSS の達人です。

私は Twitter のブートストラップが大好きで、それに基づいて多くのプロジェクトのプロトタイプを作成しています。この問題に遭遇しました。dd タグに HTML が含まれていない場合、別の dd が代わりに配置されます。なぜこれが起こっているのか理解できます。 dl のスタイルが設定されているため、コンテンツが必要な場合に dd を複数の行に展開できます。この素敵なスタイリングを壊したくありません。変更したいだけなので、dd 値が空の場合は勝っただけです。崩壊しないので、サーバー側で空の値を非表示にしたり、元の動作を変更したり、jQuery を追加したりする前に、誰かが助けてくれるかどうか知りたかったのですが、これは私が言っていることをさらに説明するための図です。これは RTL なので、dt は右側にあります。

4

5 に答える 5

55

このスタイルのオーバーライドを使用しました。

.dl-horizontal > dd:after {
  display: table;
  content: "";
  clear: both;
}
于 2012-07-10T14:38:00.737 に答える
19

開発者によると、<dd>決して空であってはなりません（私は同意しません）。

そして、彼はユーザーが空の可能性のあるsにclearfixクラスを追加することを好むと思います。<dd>

<dd class="clearfix"></dd>

アップデート

この修正は3.2以降に含まれています。リリースノートを参照してください。

于 2012-11-29T04:43:58.227 に答える
2

例：

<dd><%= @route.id %>&nbsp;</dd>

http://www.sitepoint.com/forums/showthread.php?442551-When-dd-%28in-a-definition-list%29-is-empty-below-content-is-puled-upwards

于 2014-03-20T10:48:30.880 に答える
1

このコミットを正しく解釈していれば、これが 3.0.0 のデフォルトの動作になります。それまでは、dl-horizontal単に の代わりに追加を試すこともできますclearfix。

<dd class="dl-horizontal"></dd>
于 2013-06-29T07:21:41.913 に答える
0

多分あなたはそれを試すことができます：

dd {
    display: inline-block;
}
于 2014-08-08T05:11:26.667 に答える