Зная ч / б панель навигации и панель контента, не могу найти проблему после небольшой отладки - PullRequest
0 голосов
/ 10 сентября 2018

Image of the resultant template

Привет, я хотел спросить, что я не понимаю, почему это маргинальное пространство ч / б с навигационной панелью и блоком контента, который я дважды проверил, попробовал некоторую отладку с использованием chrome, но все еще не нашел де-факто, вызывающее эту ошибку ... код ниже:

/*css code*/
    #header{
    
        height: 85px;
        padding: 0px 50px 0px 50px;
        margin-left: 200px;
        margin-right: 200px;
        border-radius: 20px;
        background-color: cyan;
        border-bottom-left-radius: 0px;
        border-bottom-right-radius: 0px;
        
    }
    body{
        background-image: url(gods_of_egypt_elodie_yung-3840x2160.jpg);
    	background-attachment: fixed;
        background-repeat: no-repeat;
        background-size: cover;
     
    }
    #heading{
        color: aliceblue;
        font-size: 70px;
    
        text-align: center;
    	margin: 0px;
    }
    #navbar{
     
        background-color: grey;
        margin: 0px 200px 0px 200px;
    	height: 30px;
    	overflow: hidden
    
      
    }
    ul{
        padding: 0px;
        margin: 0px;
    	font-family: arial;
    }
    li{
    	display: inline;
    }
    a{
    	display: block;
        text-align: center;
    	float: left;
    	width: 100px;
    	padding: 3px;
    	line-height: 25px;
    	text-decoration: none;
    	color: white;
    	margin-top: 0px;
    }
    a:hover{
    	background-color: #d3d3d3;
    	color: black;
    }
    /*
    #searchbar{
    	
    	margin-left: 250px;
    	margin-top: 4px;
    	margin-bottom: 0px;
    }*/
    #content{
    	background-color: white;
    	height: 400px;
    	margin: 0px 200px 0px 200px;
    }
     <html>
    <link rel="stylesheet" href="stylesheet.css">
    <body>
    
    
        <div id="header">
            <h1 id="heading">#Some Stuff</h1>
        </div>
        <div id="navbar">
           <ul>
               <li><a href="#">Home</a></li>
               <li><a href="#">Products</a></li>
               <li><a href="#">More</a></li>
               <li><a href="#">About US</a></li>
            </ul>
    </div>
        <div id="content">
    	<p>WOW!
    	</p>
    	</content> 
    	
    	</body>
    </html>


    

, пожалуйста, помогите решить эту проблему, потому что я совершенно не понимаю, почему я застрял здесь

1 Ответ

0 голосов
/ 10 сентября 2018

БЫСТРЫЙ:

#content p
{
    margin:0px;
}

ПОЯСНЕНИЯ

По умолчанию некоторые браузеры устанавливают автоматическое поле для тегов.

Например, для тела

margin: 8px;

В теге . В своем коде вы можете просто добавить:

body {
     background-image: url(gods_of_egypt_elodie_yung-3840x2160.jpg);
     background-attachment: fixed;
     background-repeat: no-repeat;
     background-size: cover;

     margin: 0px; //THIS LINE HERE!
     }

То же самое относится и к тегу

p {
display: block;
-webkit-margin-before: 1em;
-webkit-margin-after: 1em;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
}

ТАК, также вы можете заставить

 margin:0px;
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...