Почему я когда пододвигаю формы (а точнее поиск с кнопкой) вниз немного, то пододвигается и меню навигации (Галерея, Главная, об авторе и тд)????
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>MegaApple</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="header">
<div id="dollar">
<img src="images/dollar.jpg">
</div>
<div id="research">
<form>
<input type="text" name="text" placeholder="Поиск по сайту">
<input type="submit" name="submit" placeholder="Найти">
</form>
</div>
<div id="menu">
<ul>
<li><a href="#">Главная</a></li>
<li><a href="#">Новости</a></li>
<li><a href="#">Об авторе</a></li>
<li><a href="#">Контакты</a></li>
</ul>
</div>
</div>
<div id="kontent">
<div id="photo">
<img src="images/kontent.jpg">
</div>
<div id="text">
<h2>Уникальный продукт</h2>
</div>
<div id="text2">
<p>MagicApple - это уникальный плод. Мы выращиваем и собираем плод.
MagicApple - это уникальный плод. Мы выращиваем и собираем плод.
MagicApple - это уникальный плод. Мы выращиваем и собираем плод.
MagicApple - это уникальный плод. Мы выращиваем и собираем плод.
MagicApple - это уникальный плод. Мы выращиваем и собираем плод.
MagicApple - это уникальный плод. Мы выращиваем и собираем плод.</p>
</div>
<div id="mini_photo">
</div>
</div>
<div id="footer1">
<div id="textfooter1">
<p>СМИЩНОООООО</p>
</div>
</div>
<div id="footer2">
<div id="copyright">
<p>Copyright (C) 2014</p>
</div>
<div id="number">
<p id="p1">Консультация по телефону:</p>
<p id="p2>">+7(967)666-666-1</p>
</div>
</div>
</body>
</html>
@import url(http://fonts.googleapis.com/css?family=Poiret+One&subset=latin,cyrillic);
body {
background: #191919;
margin: 0;
font-family: "Poiret one", sans-serif;
}
#header {
background: #000;
width: 1100px;
height: 120px;
margin: auto;
}
#kontent {
background: #FFFFFF;
width: 1100px;
height: 1000px;
margin: auto;
}
#footer1 {
background: #F8F8F8;
height: 175px;
width: 1100px;
margin: auto;
}
#footer2 {
background: #FFFFFF;
width: 1100px;
margin: auto;
height: 105px;
}
#dollar {
padding-top: 10px;
padding-left: 30px;
float: left;
}
#photo {
padding-top: 20px;
padding-left: 160px;
}
#text {
padding-left: 200px;
font-size: 25px;
}
#text2 {
width: 700px;
padding-left: 200px;
font-size: 20px;
font-weight: bolder;
}
#copyright {
float: left;
padding-top: 30px;
padding-left: 80px;
font-weight: bold;
}
#number {
float: right;
padding-right: 80px;
padding-top: 2px;
}
#p1 {
font-weight: bold;
font-size: 20px;
}
#menu {
float: right;
}
#menu ul {
padding-top: 22px;
list-style-type: none;
padding-right: 129px;
}
#menu li {
float: left;
padding: 30px;
}
#menu a {
text-decoration: none;
font-size: 20px;
font-weight: bold;
color: #fff;
}
#menu a:hover {
color: rgb(226, 255, 0);
}
#textfooter1 {
padding-top: 1px;
padding-left: 290px;
}
#textfooter1 p {
font-size: 54px;
font-weight: bold;
}
#research {
float: right;
padding-right: 158px;
}
