V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
placeholder
V2EX  ›  问与答

是这样的,我找了个工具站拖了一个 grid 布局,但是它有点奇怪啊

  •  
  •   placeholder · 2022-02-21 17:42:38 +08:00 · 1172 次点击
    这是一个创建于 766 天前的主题,其中的信息可能已经有所发展或是发生改变。

    就是 mainArea 的高度是受 fr 单位控制的,我怎么让他占满剩下的整个浏览器的空间呢?实在是不知道该搜什么了。

    codepen:https://codepen.io/cstarx/pen/mdqxYRx

    5 条回复    2022-02-21 19:43:33 +08:00
    PinkRabbit
        1
    PinkRabbit  
       2022-02-21 17:50:03 +08:00
    .container 加上个高度 100vh ?
    frank553000
        2
    frank553000  
       2022-02-21 17:52:24 +08:00
    height: calc(100vh - 头部高度 - 尾部高度);
    66beta
        3
    66beta  
       2022-02-21 17:57:13 +08:00
    html, body {
    height: 100%;
    margin: 0;
    }
    .container {
    height: 100%;
    cyrbuzz
        4
    cyrbuzz  
       2022-02-21 19:32:43 +08:00
    https://stackoverflow.com/questions/45870323/does-css-grid-have-a-flex-grow-function

    fr 和 flex-grow 是类似的,所以只要把 grid 的元素的高度撑满就可以。
    placeholder
        5
    placeholder  
    OP
       2022-02-21 19:43:33 +08:00
    @PinkRabbit
    @frank553000
    @66beta
    @cyrbuzz

    学习了学习了,感谢各位
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   5108 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 33ms · UTC 09:34 · PVG 17:34 · LAX 02:34 · JFK 05:34
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.