gpt4 book ai didi

html - 如何使网格的内容可滚动并删除右侧的滚动条

转载 作者:行者123 更新时间:2023-11-27 23:51:24 25 4
gpt4 key购买 nike

我有一个使用 CSS 网格的网站布局。我设置了

html, body {
height: 100vh;
margin: 0px;
}

它是一个 2x2 网格,我只希望第二行中的网格 iten 可以滚动,具体取决于它们的内容。无论如何我都无法让它工作。

这是当前情况的截图:

enter image description here

在这种情况下我想要实现的是:

enter image description here

如果内容溢出第二行的网格元素空间,右侧的元素也应该是可滚动的。我使用了 y-overflow:auto 但它只给我空的滚动条。另外我想设计滚动条的样式,不知道该怎么做。非常感谢任何帮助。

网站正文的 html 结构如下:

<body class="boundary">
<div class="body_container">
<div">...</div>
<div> ...</div>
<div>
<div>MENU</div>
<div>MENU</div>
<div>MENU</div>
...
</div>
<div>TEST</div>
</div>
</body>

.body_container CSS 是:

.body_container {
display: grid;
grid-template-columns: 200px auto;
grid-template-rows: 80px auto;
min-height: 100%;
}

最佳答案

只需将 min-height 替换为 height

关于html - 如何使网格的内容可滚动并删除右侧的滚动条,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56511067/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com