2
그래서이 문제는 어디 까지나 lis 높이를 그 행의 가장 높은 높이와 같게 만드는 방법을 찾지 못하는 것 같습니다. 나는 그것이 작동하도록 만들었지 만 모든 lis 높이를 가장 높은 높이와 같게 만든다. 다음 코드는 내가 지금까지 가지고있다 : https://codepen.io/benasl/pen/ooLrON?editors=1010표가없는 자바 스크립트가있는 같은 높이의 행
var max = -1;
var list = document.getElementsByTagName('li');
Array.prototype.forEach.call(list, function(child) {
max = max > child.style.height ? max : child.offsetHeight;
console.log(child.offsetHeight);
});
Array.prototype.forEach.call(list, function(child) {
child.style.height = max + 'px';
});
ul {
list-style: none;
padding: 0;
width: 100%;
}
li {
padding: 5px 10px;
display:block;
position:relative;
height: 100%;
}
p {
width: 100%;
}<div class="row">
<div class="col-sm-4">
<ul>
<li><p>testt tte sttest testtesttesttes ttesttes ttesttesttest</p></li>
<li><p>test</p></li>
<li><p>test aaaaaaaa aaaaaaaaa a aaaa aaaaaaaa</p></li>
<li><p>test</p></li>
</ul>
</div>
<div class="col-sm-4">
<ul>
<li><p>testtesttestt esttesttesttes ttesttesttestte sttesttest</p></li>
<li><p>test</p></li>
<li><p>test aaaaaaaa aaaaaaaaa a aaaa aaaaaaaa</p></li>
<li><p>test</p></li>
</ul>
</div>
<div class="col-sm-4">
<ul>
<li><p>testtest testtes ttesttes ttesttesttestt esttestte assaas sasaas saassa sasasasaassa sttest</p></li>
<li><p>test</p></li>
<li><p>test aaaaaaaa aaaaaaaaa a aaaa aaaaaaaa</p></li>
<li><p>test</p></li>
</ul>
</div>
</div>
그것이 JS 솔루션을해야 하는가 (결과를 볼 수 실행에 클릭)? CSS 만 가능합니까? 'li'를 행별로 그룹화하지 않기 때문에 같은 높이가됩니다. 아래에있는 모든 'li'이 하나의 큰 양동이를 가지므로 가장 큰 것을 찾아 크기를 모두 맞 춥니 다. – hungerstar
"그 행에서만"의미하는 것은 무엇입니까? 당신은 단지 한 줄만 가지고 있습니다. 그리고 다른 문제는 문서의 모든 li을 선택하는 선택 자입니다. 당신은 선택자로서 행 클래스를 사용하여 시도하고 리를 반복합니다. – dama
@dama 안에 3 ul가 있습니다. 그는이 uls에서 가장 큰 리의 높이를 검색하고 각 li에 가장 높은 값을 적용하려고합니다. 그래서 모든 리가 같은 높이를 가지고 있습니다. –