在Bootstrap4中,空的<dd>折叠对应的</dd> <dt>的行高

时间:2019-01-26 10:33:42

标签: twitter-bootstrap bootstrap-4

所以我可以看到此错误先前已在

上出现过

strict check

并且开发者之前曾说过,这不是固定的,但是...

prevent-twitter-bootstrap-empty-dd-filling-with-next-dd-value

如图所示,空的地址字段会导致标签之间的边距折叠。它是通过带有以下内容的Django模板制作的:

                        out    lane  lane
code                    side  check  case  comment
---------------------  -----  -----  ----  -------------------------------------------------
                          v
switch (x) {              v >>>  v       
  case 0:                        ? >>> v   if case is true, change lane
  case 1:                        ? >>> v   if case is true, change lane
    doThis();                    v     v
  case 2:                        ? >>> v   if case is true, change lane
    doSomethingElse();           v     v
    break;                v <<<<<<<<<< .   break statement, back to program flow
  default:                v      ? >>> v   change lane if value is not in other case clauses
                          v      v
}                         v <<<  .         end of switch
                          v

注意:我尝试过强制创建一个行的情况。我会认为,行距应该由dt设置,据我了解应该始终存在并且永远不应为空?

3 个答案:

答案 0 :(得分:0)

只需为每个min-height元素设置一个dd,如下所示:

dd {
 min-height: 25px;
}

答案 1 :(得分:0)

所以我设法解决了这个问题,尽管感觉就像是黑客一样,但我对Bootstrap并未对此加以控制感到惊讶。使用上面的答案(我之前曾尝试过使用它的变体)最终得到:

dd.col-sm-9 {
    min-height: 25px;
}

因为整洁的dd声明导致:

Col Min-Height Over Writes DD Min Height

答案 2 :(得分:0)

您可以尝试以下方法:

dl dd:after {
  content: "\200b";
}

这是一个0px的宽度空间,不会创建新行