Html 我正在尝试为div.logo添加阴影，但它不起作用_Html_Css_Frontend

Html 我正在尝试为div.logo添加阴影，但它不起作用

html css

Html 我正在尝试为div.logo添加阴影，但它不起作用,html,css,frontend,Html,Css,Frontend,我试着在谷歌上搜索，但找不到任何相关的东西。我想这是因为我把它转换成了1.1的比例，但是阴影的大小不也应该随之增加吗 <body> <div id="landing"> <nav id="main-nav"> <div class="container"> <div class="logo"> <a href="#">&

我试着在谷歌上搜索，但找不到任何相关的东西。我想这是因为我把它转换成了1.1的比例，但是阴影的大小不也应该随之增加吗

 <body>
    <div id="landing">
        <nav id="main-nav">
            <div class="container">
            <div class="logo">
                <a href="#"><img src="./img/logo_final-final.png" alt=""></a>
            </div>
            <div class="nav-btns btns-container">
                <div><a href="#">Home</a></div>
                <div><a href="#">Store</a></div>
                <div><a href="#">Offers</a></div>
                <div><a href="#">FAQs</a></div>
                <div><a href="#">Contact Us</a></div>
            </div>
            </div>
        </nav>
    </div>
</body>

CSS- *{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

a{
  text-decoration: none;
}

#landing{
  position: absolute;
  width: 100vw;
  height: 100vh;
  background: url(/html/img/landing\ background.png) no-repeat center center/cover;
}

#main-nav{
  position: relative;
  top: 5%;
  margin: auto;
  width: 90%;
  background: #007FFF 0% 0% no-repeat padding-box;
  box-shadow: 0px 10px 40px #00000029;
  border-radius: 40px;
  opacity: 0.9;
}

#main-nav *{
  border: 1px black soli
}
#main-nav .container{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
}

#main-nav .container .logo {
  width: 7%;
  height: 5%;
  background-color: #FFFFFF;
  border-radius: 3rem;
  transform: scale(1.1);
  z-index: 2;
  box-shadow: 5px 10px #00000029;
}

#main-nav .container .logo img{
  position: relative;
  max-width: 100%;
  height: auto;
}

我不知道还要写多少细节，所以如果您有任何问题，请告诉我。

您好，如果您同意，请尝试使用css

主导航。集装箱。标志{ 盒影：0px 0px 10px 1px 000； } *{ 保证金：0；填充：0；框大小：边框框； } a{ 文字装饰：无； } 降落{ 位置：绝对位置；宽度：100vw；高度：100vh；背景：url/html/img/landing\background.png无重复中心/封面； } 主导航{ 位置：相对位置；最高：5%；保证金：自动；宽度：90%；背景：007FFF 0%0%无重复填充框；盒影：0px 10px 40px 00000029；边界半径：40px；不透明度：0.9； } 主导航*{ 边框：1件黑色soli } 主导航集装箱{ 显示器：flex；弯曲方向：行；柔性包装：包装；对齐项目：居中； } 主导航。集装箱。标志{ 宽度：7%；身高：5%；背景色：FFFFFF；边界半径：3rem；转换：scale1.1； z指数：2；盒影：5px10px 00000029； } 主导航集装箱。标志img{ 位置：相对位置；最大宽度：100%；高度：自动； }

编辑-现在它似乎工作良好。我不知道发生了什么，但它不起作用。也许VSCode有问题？如果你运行VSCode，十六进制颜色代码是不正确的00000029Oh我不知道。谢谢

it looks like the shadow to div.logo works fine