BcuzofU
a1exlee
2017-03-27 14:38
采纳率: 100%
浏览 4.4k

CSS设置100%高度溢出的问题

设置了三个div,期望三个div自动铺满浏览器且随浏览器的缩放自动调整宽高,因为设置了border,所以加上了样式box-sizing: border-box;但是y轴上还是出现了滚动条请教是啥原因,css小白求教

图片说明

代码如下:

<html style="height:100%">

    <head>
        <meta charset="utf-8">
        <style>
            div {
                border: 1px solid;
                box-sizing: border-box;
            }

            .header {
                height: 20%;
                width: 100%;
            }

            .left {
                float: left;
                width: 25%;
                height: 80%;
            }

            .right {
                width: 75%;
                float: left;
                height: 80%;
            }
        </style>
    </head>

    <body style="height:100%;">
        <div class="header">
        </div>
        <div class="left">
        </div>
        <div class="right">
        </div>
    </body>

</html>

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

2条回答 默认 最新

  • ning0_o
    宁00 2017-03-28 02:42
    已采纳

    浏览器的body默认有8px的margin值,设置

     body{margin: 0}
    

    即可

    点赞 评论
  • devmiao
    devmiao 2017-03-27 14:52
    点赞 评论

相关推荐