我想使dt / dd对紧密对齐，但不要互相碰触。我现在有这个：
使用此CSS：
dl {
width: 100%;
overflow: hidden;
margin: 0;
}
dt {
float: left;
text-align: right;
width: 30%;
}
dd {
float: left;
width: 70%;
margin: 0;
}
我想要这个：
但是，每当我使用诸如padding-right：5px或margin-right或margin的标记时，dd部分总会换行，如下所示：
我不希望在dt元素周围有很大的填充，我想要的只是将它们与每个dd分开。我希望dt和dd之间的距离大于两个连续行之间的距离。
最佳答案
将box-sizing: border-box添加到dt元素，因此即使您添加了填充和边框，其宽度也将保持30％
只需注意70％+ 30％= 100％。如果您添加30像素，它将大于100％。
基本上，将属性box-sizing设置为border-box时，您说元素必须为该宽度，然后将根据该宽度计算出填充和边框，而不是像默认的box-model那样添加