пробел над div, когда текст вводится внутри div

У меня странная проблема с некоторыми странными пробелами над тегом div.пробел над div, когда текст вводится внутри div

Проблесковое пустое пространство находится над черным заголовком вверху. Странно то, что это пространство появляется только при вводе текста в <div id="#header">. Я попытался добавить margin 0 и padding 0 в тег div #header, но ничего не работает. Как только я прокомментирую тэг h1, пробел исчезнет. Такая же проблема возникает и в Firefox, и в Chrome.

Вот мой HTML-код ...

<!DOCTYPE HTML> 

<head> 

    <title>Test Site</title> 

    <link rel="stylesheet" type="text/css" href="./css/style.css"/> 

</head> 

<body> 

    <div id="header"> 

     <h1>My test site</h1> 
    </div> 

    <div id="navbar"> 
    </div> 

    <div id="main_window"> 
    </div> 


</body>

Вот мой CSS ...

html { 
    padding: 0; 
} 

body { 
    margin: 0%; 
    padding: 0%; 
    font-family: sans-serif; 
} 

#header { 
    background-color: black; 
    height: 150px; 
    margin: 0px; 
    color: white; 
} 

#header, h1 { 
/*position: absolute;*/ 
bottom: 0; 
} 

#navbar { 
    background-color: darkblue;; 
    height: 40px; 
    box-shadow: 0px 10px 8px #888888; 
}

Любая помощь будет оценена.

UPDATE:

то же самое, это произойдет в другой раздел на моем сайте ...

<div id="navbar"> 
     <div id="navbar_container"> 
      <ul> 
       <li class="navlink"><a href="./rlg.php" >RLG</a></li> 
       <li class="navlink">Test</li> 
       <li class="navlink">Test 2</li>  
      </ul> 
     </div> 
    </div> 




#navbar { 
    background-color: darkblue;; 
    height: 40px; 
    box-shadow: 0px 10px 8px #888888; 
} 

#navbar_container { 
    width: 1000px; 
    margin: 0px auto; 
} 

.navlink { 
    display: inline-block; 
    padding-right: 2px; 
    border-right: 1px solid white; 
} 

.navlink, a { 
    margin: 0px auto; 
}

источник

2013-07-20 Adam M

попробовать с помощью * {отступы: 0; маржа: 0} в вашем CSS – Hushme

это плохая идея, это влияет на все элементы! –

Заканчивать this вопрос о «стилей агента пользователя». В принципе, есть встроенный CSS, который ваш браузер делает по умолчанию, и в этом случае он влияет на ваш h1. В h1 есть край выше и ниже, и это то, что вызывает ваши пробелы. Поэтому попробуйте добавить css в h1, а не в div #header.

источник

2013-07-20 21:11:34

вы должны установить margin:0px для H1 тега

смотри пример:

Example

источник

2013-07-20 21:11:36

пробел над div, когда текст вводится внутри div

ответ

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