Question

我有一组5 div个，都有自动宽度。

文本将动态插入到每个div中，我想将所有div的宽度更改为5中的最大值。

有什么想法吗？

＆＃13;

.box {
  display: inline-block;
  border: 1px solid #eaeaea;
}

＆＃13;

<div class="box">Hi</div>
<div class="box">Hi John</div>
<div class="box">Hello John</div>
<div class="box">Hello John Doe</div>

＆＃13;

我想我应该使用JS，但我想知道是否可以避免它。

Answer 1

我会使用javascript：

function setWidth(e,w) {
    e.setAttribute("style","width:"+ w +"px");
    e.style.width= w +'px';
}
var boxes = document.getElementsByClassName("box");
var max = 0;
for (var i = 0; i < boxes.length; i++) {
    var width = boxes[i].clientWidth;
    if (width > max) max = width;
}
for (var i = 0; i < boxes.length; i++) {
    setWidth(boxes[i],max);
}

根据最大div设置div宽度

1 个答案: