<分区>
<分区>
我有 5 个 div，每个高度为 100vh，宽度为 100vw，在一个更大的 div(高度为 100vh，宽度为 500vw)中彼此水平对齐。
但是，这些 div 中的每一个周围似乎都有一个边框，这使得它们的宽度和高度略大于 100%。
如何去除这个边框？我注意到它并不是真正的“边框”，而是 div 之间的空间。
body {
height: 100vh;
margin: 0;
padding: 0;
}
.section {
display: inline-block;
height: 100vh;
width: 100vw;
max-width: 100%;
background-color: blue;
}
.sectionOverlay {
width: 500vw;
height: 100vh;
}<div class="sectionOverlay">
<div class="section" id="s1">
</div>
<div class="section" id="s2">
</div>
<div class="section" id="s3">
</div>
<div class="section" id="s4">
</div>
<div class="section" id="s5">
</div>
</div>最佳答案
内联元素对代码中的空格敏感。删除空白，间隙消失:
body {
height: 100vh;
margin: 0;
padding: 0;
}
.section {
display: inline-block;
height: 100vh;
width: 100vw;
max-width: 100%;
background-color: blue;
}
.sectionOverlay {
width: 500vw;
height: 100vh;
}<div class="sectionOverlay">
<div class="section" id="s1">
</div><div class="section" id="s2">
</div><div class="section" id="s3">
</div><div class="section" id="s4">
</div><div class="section" id="s5">
</div>
</div>关于html - 在 100vh/100vw div 附近获取边界？ (影响div的总宽高)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/58272995/