容器不会显示填充

Question

我的.container不会显示填充。我尝试了多种方法，但它不会填充。

CSS：

nav{
    border-style: solid;
    border-color: green;
    float: left;
    padding-left: 10px;
    padding-right: 10px;
    display: inline-block;
    height: 70vh;
}

ul{
    padding:0px;
    list-style-type:none;
}

.container{
    border-top: solid;
    border-right: solid;
    border-bottom: solid;
    border-color: green;
    padding-left: 10px;
    width: 97vw;
    height: 70vh;
}

HTML：

<article>
<nav>
<ul style="list-style-type:none;">
<li><strike>home</strike></li>
<li><a href="portfolio.php">portfolio</a></li>
<li><a href="portfolio.php">dsdfsdfs</a></li>
</ul>
</nav>
<div class="container"></div>
</article>

无论我将padding-left设置为什么值，填充总是保持不变。

Answer 1

Fiddle link

更新了CSS：

nav{
    border-style: solid;
    border-color: green;
    float: left;
    padding-left: 10px;
    padding-right: 10px;
    display: inline-block;
    height: 70vh;
}

ul{
    padding:0px;
    list-style-type:none;
}

.container{
    border-top: solid;
    border-right: solid;
    border-bottom: solid;
    border-color: green;
    padding-left: 10px;
    width: 75vw;
    height: 70vh;
    display: inline-block;
    float: left;
    margin: 0px;
}