Как автоматически отрегулировать ширину DT DD в CSS? ⇐ Html

[Anonymous]

Я использую DT и DD для создания бумажной формы. < /p>
Ширина DT должна соответствовать слову, а DL должен совпадать с пространством < /p>
Теперь я корректирую каждую строку вручную, как я могу использовать CSS, чтобы сделать это? class = "Snippet-Code-CSS Lang-CSS PrettyPrint-override">

Код: Выделить всё

div {
width: 200px;
}

/* dl dt dd same line */

dl {
width: 100%;
overflow: hidden;
padding: 0;
margin: 0
}

dt {
float: left;
/* adjust the width; make sure the total of both is 100% */
padding: 0;
}

dd {
float: left;
/* adjust the width; make sure the total of both is 100% */
margin: 0;
box-sizing: border-box;
border-bottom: 1px solid black;
}

dl dt:nth-of-type(1) {
width: 36%;
}

dl dd:nth-of-type(1) {
width: 64%;
}

dl dt:nth-of-type(2) {
width: 26%;
}

dl dd:nth-of-type(2) {
width: 74%;
}

dl dt:nth-of-type(3) {
width: 14%;
}

dl dd:nth-of-type(3) {
width: 86%;
}< /code>


aaabbbccc:
 
aaabbb:
 
aaa:
 

Подробнее здесь: https://stackoverflow.com/questions/691 ... dth-in-css