So I can see that this error has had previous chatter on
prevent-twitter-bootstrap-empty-dd-filling-with-next-dd-value
and that the developer had previously said it wasn’t be fixed but…
As shown empty address fields result in the margins between the labels collapsing. It is produced via a Django template with:
<dl class="row">
<dt class="col-sm-3">Address 1:</dt><dd class="col-sm-9">{{ client.address1|default_if_none:" " }}</dd>
<dt class="col-sm-3">Address 2:</dt><dd class="col-sm-9">{{ client.address2|default_if_none:" " }}</dd>
<dt class="col-sm-3">Town:</dt><dd class="col-sm-9">{{ client.town|default_if_none:" " }}</dd>
<dt class="col-sm-3">County:</dt><dd class="col-sm-9">{{ client.county|default_if_none:" " }}</dd>
<dt class="col-sm-3">Postcode:</dt><dd class="col-sm-9">{{ client.postcode|default_if_none:" " }}</dd>
<dt class="col-sm-3">Telephone1:</dt><dd class="col-sm-9">{{ client.telephone1|default_if_none:" " }}</dd>
<dt class="col-sm-3">Telephone2:</dt><dd class="col-sm-9">{{ client.telephone2|default_if_none:" " }}</dd>
<dt class="col-sm-3">Email:</dt><dd class="col-sm-9">{{ client.email|default_if_none:" " }}</dd>
</dl>
Note: I have tried to force a space incase that would create a line. I would have thought that the linespacing would have been set by dt which I understand should always exist and should never be empty?
3
Answers
So I have managed to fix this although it feels like a hack and I'm surprised that Bootstrap hasn't got this under control. Using the answer above (which I had previously tried a variation of) I have ended up with:
Because a neat dd declaration results in:
Just set a
min-height
to everydd
element like this:you could try this:
that is a 0px width space and will not create a new line