更改图像的边距值未生效

Question

问题：

• 我使导航栏图像的边距值
为 0px 8.14% 0px 8.14%
• 现在我发现它太像图像比我的高时一样多了 屏幕，它会在右侧形成一个滚动条，并且由于某种原因 最后一个导航转到下一行。
• 当我尝试将边距值更改为 0px 8% 0px 8% 时，它可以保存并上传，但是当 我检查检查菜单中的值(这就是它的名字吗？ 它仍然是旧值。

幻灯片中的图像只是用于测试功能的随机图像，而不是我正在使用的图像。 另外，与其做邪恶的堆栈事情，你能告诉我我做错了什么吗？

我想我必须展示我的代码。

.HTML：

<div id="nav">
<a href=index.html>    
<img class="navimg" id="homeimg" src=Images/Home.png alt="Home"></a>
<a href=Webpages/about.html>
<img class="navimg" id="aboutimg" src=Images/About.png alt="About"></a>
<a href=Webpages/contact.html>
<img class="navimg" id="contactimg" src=Images/Contact.png alt="Contact"></a>
<a href=Webpages/extlinks.html>
<img class="navimg" id="extimg" src=Images/External.png alt="External"></a>
</div>

.CSS：

body {
width: 100%;
height: 100%;
margin: 0%;
}
#nav {
width: 100%;
min-height: 6%;
max-height: 6%;
background-color: #3C3C8D;
.navimg {
height:100%;
float:left;
margin: 0px 8% 0px 8%;
padding: 0px 0px 0px 0px;
}

完整的代码在 http://jsfiddle.net/1s3byt56/，我的网站是 http://weeklyrandomthing.000webhostapp.com/非常感谢

编辑：我正在使用FileZilla上传到FTP服务器(files.000webhost.com:21(和记事本++来编辑代码。当我上传时，所有传输都正常，但实际网站似乎没有更新，即使随着时间的推移也是如此。我应该问另一个问题来解决这个问题吗？

编辑 2：是的，我现在准备删除这个问题，但我不能。这里列出的问题甚至不是问题。我的网站只是没有更新。和平出来。

Answer 1

尝试使用弹性框并为 #nav 定义高度。此位置的百分比值使结果不可预测。

body {
width: 100%;
height: 100%;
margin: 0%;
}
#nav {
display: flex;
justify-content: space-around;
width: 100%;
height: 10em;
background-color: #3C3C8D;
}
#nav a {
display: flex;
justify-content: center;
}
.navimg {
display:block;
height:100%;
width: auto;
margin: 0 auto;
}

<div id="nav">
<a href=index.html>    
<img class="navimg" id="homeimg" src="https://source.unsplash.com/400x300/?nature" alt="Home">
</a>
<a href=Webpages/about.html>
<img class="navimg" id="aboutimg" src="https://source.unsplash.com/400x300/?urban" alt="About">
</a>
<a href=Webpages/contact.html>
<img class="navimg" id="contactimg" src="https://source.unsplash.com/400x300/?animals" alt="Contact">
</a>
<a href=Webpages/extlinks.html>
<img class="navimg" id="extimg" src="https://source.unsplash.com/400x3007?sea" alt="External">
</a>
</div>