在處理一些表單內(nèi)容時飘蚯,我們經(jīng)常遇到時長短不一的標(biāo)題兩端對齊的需求馍迄。
可以看出,其實text-align:justify對于最后一行是沒有效果的局骤。這個時候有兩種解決方法攀圈。
1.在末尾添加元素
.item { height: 32px; line-height: 32px;? margin-bottom: 8px;}
.label {? display: inline-block; height: 100%; width: 100px; text-align: justify; vertical-align: top;}
.label::after { display: inline-block; width: 100%; content: ''; height: 0; }?
.value { padding-right: 10px; }?
2.屬性text-align-last
兼容性一些瀏覽器不行
.item { margin-bottom: 8px;}
?.label { display: inline-block; height: 100%; min-width: 100px; text-align: justify; text-align-last: justify; }
.value { padding-right: 10px; }?