利用 fit-content 实现兄弟元素等宽
在页面中，我们希望红色和灰色元素的宽度跟随绿色元素的宽度一致。以下是实现这一效果的方法：
在包含兄弟元素的容器元素上设置 width: fit-content。这将使容器仅适应其子元素的宽度。
.container {
width: fit-content;
}然而，这样会导致滚动条出现在 body 元素中。为了解决这个问题，可以在 container 元素外部再套一层 div 元素。
<div class="wrap">
<div class="container">
<div class="item1">item1</div>
<div class="item2">item2</div>
<div class="item3">item3</div>
</div>
</div>.wrap {
width: 100%;
overflow-x: auto;
}这样就可以在保持兄弟元素等宽的同时，避免滚动条出现在不合适的地方。
以上就是如何使用 fit-content 实现兄弟元素等宽并避免出现滚动条？的详细内容，更多请关注php中文网其它相关文章！
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
262
收藏
