Как избавиться от пробелов в верхней части моей веб-страницы?

Как избавиться от пробелов в верхней части моей страницы?Как избавиться от пробелов в верхней части моей веб-страницы?

Я попытался CSS сброс, удаление <P> тегов, изменение <body>, <html> и <div> поля и ничего не похоже на работу.

<html> 
    <head> 
     <title>Title</title><meta charset="UTF-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
     <style> 
      html, body { 
       margin: 0; 
       padding: 0; 
      } 

      #container { 
       background-color: black; 
       color: white; 
       width: 800px; 
       margin-top: 0px; 
       margin-bottom: 0px; 
       margin-left: auto; 
       margin-right: auto; 
      } 
      #inner-container { 
       margin: 10px 10px 10px 10px; 
      } 
      p { 
       margin-top: 0px; 
      } 

     </style> 
    </head> 
    <body><div id="container"><div id="inner-container"> 
        <p>Body Text</p> 
      </div></div></body></html>

источник

2015-04-15 John Tippin

Ваши пробелы идут от верхнего края 10px на # внутреннем контейнере. См. Этот JSFiddle с верхним полем, измененным на 0px: https://jsfiddle.net/rcz6ksft/.

#inner-container { 
    margin: 0px 10px 10px 10px; 
}

источник

2015-04-15 23:20:19 JBzd

Я думаю, вы имели в виду для # внутренний-контейнер, чтобы иметь отступы расширить черный фон вместо, а также, вместо того, чтобы компенсировать весь элемент? – JBzd

Вам нужно будет удалить поля для дочерних элементов, поскольку они создадут белые промежутки, если они находятся близко к краю веб-сайта. Я обновил поля для заполнения вместо этого., Это создаст тот же эффект, однако элемент будет охватывать право на краю страницы.

  html, body { 
 
       margin: 0; 
 
       padding: 0; 
 
      } 
 

 
      #container { 
 
       background-color: black; 
 
       color: white; 
 
       width: 800px; 
 
       margin-top: 0px; 
 
       margin-bottom: 0px; 
 
      } 
 
      #inner-container { 
 
       padding: 10px 10px 10px 10px; 
 
      } 
 
      p { 
 
       margin-top: 0px; 
 
      }

<div id="container"> 
 
    <div id="inner-container"> 
 
     <p>Body Text</p> 
 
    </div> 
 
</div>

источник

2015-04-15 23:20:31

Как избавиться от пробелов в верхней части моей веб-страницы?

ответ

Смежные вопросы