我作了一個佈局，邊帶或副業出現不知道爲什麼

我做了一個新的佈局，但有邊帶或邊線（我的意思是滾動線「當太多的內容」，你必須滾動很多「，但這條邊線在谷歌瀏覽器的底部）出現在全視口不知道爲什麼會發生如果我將100vw的包裝寬度更改爲90，則右側的空白區域不好。以下是圖像：我作了一個佈局，邊帶或副業出現不知道爲什麼

這裏是我的代碼：

<!DOCTYPE html> 
<html> 
<head> 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.css"> 
<script src="https://code.jquery.com/jquery.min.js"></script> 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" type="text/css" /> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 

    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width"> 
    <title>JS Bin</title> 
</head> 
<body> 
<div class="wrap"> 
    <div class="el2">header</div> 
    <div class="el1">left</div> 
    <div class="el3"> 
    <div class="el5">pakk1</div> 
    <div class="el6">pakk1</div> 
    phakk 
    </div> 
    <div class="el4">footer</div> 
</div> 

</body> 
</html> 



* { 
    box-sizing: border-box; 
} 
.wrap { 
    width: 100vw; 
    height: 100vh; 
    background: grey; 



} 

.el2 { 
    width: 100vw; 
    height: 30vh; 
    background: #C2FF76; 
} 

.el1 { 
    width: 20vw; 
    height: 70vh; 
    background: blue; 
    float:left; 
} 
.el3 { 
    float:left; 
    width: 80vw; 
    height: 70vh; 
    background: red; 
} 
.el4 { 

    width: 100vw; 
    height: 13vh; 
    background: purple; 
    float:left; 
} 
.el5 { 
    width: 30vw; 
    height: 13vh; 
    background: green; 
    float:left; 
} 
.el6 { 
    width: 40vw; 
    height: 13vh; 
    background: green; 
    float:right; 
}

來源

2017-06-19 cool ice