为什么我的填充从我的徽标中删除？

为什么我的填充是不是在我的徽标div工作之前，我添加了额外的div，但我仍然不能看到它不工作的原因。请检查我的代码，找出是否可以帮助我:)为什么我的填充从我的徽标中删除？

<!DOCTYPE html> 
<html> 
<head> 
    <title>Learning Javacript</title> 
    <link href="main.css" rel="stylesheet" type="text/css"> 

    <link href="normalize.css" rel="stylesheet" type="text/css"> 
</head> 
<body> 
    <header> 
     <div class="contact_info"> 
     <div class="email"> 
     <img src="icons/icon_mail.png"> 
     <p>[email protected]</p> 
     </div> 
     <div class="phone"> 
     <img src="icons/icon_phone.png"> 
     <p>+40.727.123.456</p> 
     </div> 
     <div class="Social_Media"> 
      <ul> 
      <li><img src="Social/facebook.png"></li> 
      <li><img src="Social/twitter.png"></li> 
      <li><img src="Social/youtube.png"></li> 
      <li><img src="Social/googleplus.png"></li> 
      <li><img src="Social/linked.png"></li> 
      </ul> 
     </div> 
     <div class="language"> 
     <p>ENGLISH</p> 
     <img src="icons/arrow.png"> 
     </div> 
     </div> 
    </header> 
    <div class="main_real"> 
    <div class="main_img"> 
    <div class="main_nav_width"> 
    <div class="main_nav"> 
     <div class="logo"> 
      <img src="Logo/logo.png"> 
     </div> 
     <nav> 
      <ul> 
       <li><a href="#">Home</a></li> 
       <li><a href="#">About Us</a></li> 
       <li><a href="#">News</a></li> 
       <li><a href="#">Portfolio</a></li> 
       <li><a href="#">Blog</a></li> 
       <li><a href="#">Shop</a></li> 
       <li><a href="#">Contact</a></li> 
      </ul> 
     </nav> 

    </div> 
    </div> 
    </div> 
    </div> 


</body> 
</html> 
html,body,h1,h2,h3,h4,h5,h6,p,li,ul,a,nav{ 
    padding:0px; 
    margin:0px; 

} 

header{ 
    width:100%; 
    background-color:#143e6e; 
    height:40px; 
    border-top:6px solid #0d2f57; 

} 
.contact_info{ 
    width:1200px; 
    margin:0 auto; 


    } 
.contact_info p, img{ 

    float:left; 

} 
.email p,img{ 
    float:left; 
} 
.email .phone, p{ 
    padding-top:12px; 
    padding-right:60px; 
    font-family:Arial, Helvetica, sans-serif; 
    font-size:13px; 
    color:white; 

} 
.email img{ 
    padding-top:11px; 
    padding-right:10px; 
} 
.phone p,img{ 
    float:left; 
} 
.phone img{ 
    padding-top:7px; 
} 

.Social_Media ul{ 
    padding-top:10px; 
    padding-left:25px; 
    float:right; 

} 
.Social_Media li{ 
    display:inline; 

} 
.Social_Media img{ 
    padding-right:25px; 

} 
.Social_Media li:last-child img { 
    padding-right:0px 
} 
.language{ 

    float:right; 

} 
.language p{ 
    padding-right:0px; 

} 
.language img{ 
    padding-top:15px; 
    padding-left:5px; 
} 
.main_nav_width{ 
    width:100%; 
    background-color:white; 
    box-shadow: 0 5px 6px -6px black; 

} 

.main_nav{ 
    width:1200px; 
    margin:0 auto; 
    height:90px; 



} 

} 

.logo{ 
    clear:both; 
    float:left; 
    padding-top:15px; 
} 
nav ul{ 
    float:right; 
    padding-top:35px; 
    height:55px; 


} 
nav li{ 
    display:inline; 
} 
nav li:last-child a{ 
    margin-right:0px; 
} 

nav a{ 
    width:50px; 
    margin-right:20px; 
    margin-left:20px; 
    padding-top:33px; 
    padding-bottom:40px; 
    text-decoration:none; 
    height:90px; 
    color:#143e6e; 
} 
nav a:hover { 
    width:90px; 
    padding-top:35px; 
    text-decoration:none; 
    height:15px; 
    color:#143e6e; 
    border-bottom:5px solid blue; 
    padding-bottom:33px; 
} 
nav li:last-child a:hover{ 
    width:70px; 
    margin-left:20px 
} 

.main_img{ 
    background-image: url("images/imac.png"); 
    background-repeat:no-repeat; 
    background-position: 780px 64px; 
    background-repeat: no-repeat; 
    background-size:500px 500px; 
    width:100%; 
    height:650px; 
} 
.main_real{ 
    background-image: url("images/background_jumbo.jpg"); 
    background-repeat:no-repeat; 
    background-position: right top; 
    background-size:100% 480px; 
    width:100%; 
}

来源

2015-10-26 Chris.locke

我想我看到下.main_nav – jfoutch

一个额外的大括号没问题的家伙，有时得到一个全新的视角，甚至站起来，离开电脑几分钟，就完全改观 – jfoutch

检查括号。额外的花括号可能会把你扔掉。如果不尝试得到一个JSFiddle。

.main_nav{ 
width:1200px; 
margin:0 auto; 
height:90px; 



} 

} 

.logo{ 
clear:both; 
float:left; 
padding-top:15px; 
}

来源

2015-10-26 23:20:48

为什么我的填充从我的徽标中删除？

回答

相关问题