css flex a grid child的溢出

kmb7vmvb  于 2024-01-09  发布在  其他
关注(0)|答案(1)|浏览(99)

我对网格布局有问题。是一个网格容器(工作正常)一侧有一列跨越父元素的15%,剩下的空间由main占据。你可以看到所有元素都在它们的框架内,max-width和max-height。然而导航栏有一个滚动条,它溢出,你可以看到滚动条是活动的,不像主要部分。溢出只发生在一定的窗口大小以上。我的屏幕是1366 x768,但我不需要一个完整的-屏幕上得到它。一个样本here感谢您的帮助

body{
    place-content:center;
    max-height: 29.7cm;
    max-width: 30cm;
    height:100vh;
    margin: auto;
    display: grid;
    grid-template-columns: 15% 1fr%;
        }

个字符
溢出不应该在那里.我试过min-height:0,max-height:inherit或100 vh,box-sizing:border-box,我能做的一切让它消失,没有.这就像导航栏的内容比元素大几毫米,无论后者的实际大小是什么,甚至远远超过视口的限制。

3lxsmp7m

3lxsmp7m1#

问题似乎在于你把

body > * {
 overflow-y: scroll;
 overflow-wrap: break-word;
}

字符串
因为你用这个来裁剪项目,它会在元素上放置滚动条,因为你说它应该像代码说的那样。当我删除这两个属性时,滚动条消失了,但是因为其他元素上没有合适的宽度,所以它从左到右伸展,只显示中间的段落
我建议使用flex或grid创建一个div,并尝试以这种方式定位元素。
我自己还没有修好它,否则我会给予你完整的代码,但我希望我已经把你带到了正确的方向。
你好,巴比

相关问题