在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問(wèn)答/UI  網(wǎng)絡(luò)安全/ flex計(jì)算后高度在搜狗7.0下子元素高度不是根據(jù)父元素計(jì)算么?

flex計(jì)算后高度在搜狗7.0下子元素高度不是根據(jù)父元素計(jì)算么?

請(qǐng)輸入代碼搜狗7.0瀏覽器(chrome/45)與chrome63表現(xiàn)不一致(windows下會(huì)出現(xiàn)2個(gè)滾動(dòng)條),經(jīng)查看發(fā)現(xiàn)內(nèi)部?jī)蓚€(gè)div(#div1,#div2)高度并非根據(jù).bottom高度進(jìn)行計(jì)算,所以這里有一些疑問(wèn),flex計(jì)算得到的高度在某些瀏覽器內(nèi)會(huì)導(dǎo)致子元素的計(jì)算問(wèn)題么。


<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title></title>
    <style>
    html,
    body {
        padding: 0;
        margin: 0;
        width: 100%;
        height: 100%;
    }
    
    .container {
        width: 100%;
        height: 100%;
        display: flex;
    }
    
    .menu {
        width: 50px;
        height: 100%;
        background-color: #000111;
        flex-shrink: 0;
    }
    
    .body {
        width: 100%;
        height: 100%;
        flex: 1;
        display: flex;
        flex-direction: column;
    }
    
    .top {
        width: 100%;
        height: 100px;
        background-color: #fff111;
        flex-shrink: 0;
    }
    
    .bottom {
        width: 100%;
        height: 100%;
        flex: 1;
    }
    </style>
</head>

<body>
    <div class="container">
        <div class="menu"></div>
        <div class="body">
            <div class="top"></div>
            <div class="bottom">
                <div id="div1" style="width: 100%;height: 100%;overflow: auto;">
                    <div id="div2" style="width: 100%;height: 120%;"></div>
                </div>
            </div>
        </div>
    </div>
</body>

</html>
回答
編輯回答
祉小皓

坑啊,我也遇到這個(gè)問(wèn)題,在谷歌瀏覽器是可以繼承的。

2018年3月4日 01:33