[英]Why won't the background-color of my div appear?
I'm in process of setting up a drop down menu. 我正在设置下拉菜单。 I'm trying to get the div
.nav_main
to have the background-color I've given it in my CSS so that it matches the background-color of my burger menu. 我正在尝试让div
.nav_main
获得我在CSS中给出的背景颜色,以便它与我的汉堡菜单的背景颜色相匹配。 The .nav_main
background-color doesn't show up for me for some reason. 由于某种原因,
.nav_main
背景颜色不会显示给我。 I know it's trivial but I can't figure out why this is happening... 我知道这是微不足道的,但我无法弄清楚为什么会发生这种情况......
.nav_main { display: block; width: 100%; background-color: #282828; } .nav_main a { display: none; width: 100%; background-color: #282828; text-decoration: none; height: 100%; padding-top: 32px; padding-bottom: 32px; margin: 0; text-align: center; font-size: 50px; color: #fff; } .nav_main a:last-child { display: inline-block; width: auto; }
<header> <h1>Facilities Portal</h1> <div class="nav_main"> <a class="activeNav" href="index.html">Facilities Info</a> <a href="logaction.html">Log Action</a> <a href="viewaction.html">View Actions</a> <a href="keysystem.html">Key System</a> <a id="burgerIcon" class="icon" onclick="#">☰</a> </div> </header>
I'm wondering if the .nav_main a
display: none
is causing the issue. 我想知道
.nav_main a
是否display: none
是否导致问题。 If so how do I get around this so the div .nav_main
background-color appears and fills the entire width of the page? 如果是这样,我如何绕过这个,所以div
.nav_main
background-color出现并填充页面的整个宽度?
Basically I want .nav_main
div background-color to appear and fill out the entire width of the page with the burger icon floating to the right. 基本上我想要
.nav_main
div background-color出现并填充页面的整个宽度,汉堡图标浮动到右边。 Essentially I'll set the burger up to make .nav_main a
display change to block
. 基本上我会设置汉堡使
.nav_main a
显示更改为block
。
I have tested your code and it works just fine on my end. 我已经测试了你的代码,它在我的最后工作得很好。 What I noticed;
我注意到了什么;
div
as well as the links. div
和链接设置相同的颜色。 This might be the reason you are not seeing a difference. display:none
and hence might also not be able to tell which color they are. display:none
隐藏链接,因此也可能无法分辨它们是哪种颜色。 You might want to run the code on another machine to make sure the issue is not with your machine. 您可能希望在另一台计算机上运行该代码,以确保问题不在您的计算机上。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.