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

#main_menu {
float: left;
position: fixed;
left: 0px;
top: 30px;
padding-right: 10px;
background: #454545;
background: -moz-linear-gradient(top, #454545, #737373);
background: -webkit-gradient(linear, center top, center bottom from(#454545,), to(#737373));
opacity: 0.9;
-moz-border-radius: 0px 10px 10px 0px;
-webkit-border-bottom-right-radius: 10px;
-webkit-border-top-right-radius: 10px;
border-radius: 0px 10px 10px 0px;
border: 1px solid #eee;
-moz-box-shadow: 0px 0px 2px #444;
-webkit-box-shadow: 0px 0px 2px #444;
box-shadow: 0px 0px 2px #444;
border:1px solid #0F0;
}
#navigation {
list-style: none;
margin: 0;
padding: 0;
float: left;
margin-left: 10px;
border:1px solid #0F0;
/*border-left: 1px solid #333;*/
}
/*#navigation li {
float: left;
}*/
#navigation li a {
float: left;
padding: 5px 5px;
width:  100px;
text-decoration: none;
font-size: 14px;
font-family: Arial, Helvetica, sans-serif;
/*border-right: 1px solid #333;
border-left: 1px solid #888;*/
text-align: left;/*расположение текста слево справа в центре*/
color: #dede5d;
text-shadow: 3px 1px 3px #111;
border:1px solid #0F0;
}

/*при наведении красивое выделение*/
#navigation li a:hover{
background: #555;
background: -moz-linear-gradient(top, #555, #333 50%, #222 95%, #454545);
background: -webkit-gradient(linear, center top, center bottom from(#333,), to(#454545));
color: #ededed;
text-shadow: -3px -1px 3px #555;
border:1px solid #0F0;
}
#searchbar {
	border:1px solid #0F0;
}
#searchform { 
border:1px solid #0F0;
}
#searchform input {
	/*padding:2;
	border-radius:6 0 0 6;
}

#searchform input {
	outline:none;
	padding:2;
	border-radius:6 0 0 6;*/
}
#searchform input[type='text'] {
height: 24px;
width: 200px;
border: 1px solid #fff;
border-right: none;
background-color: #ccc;
padding-left: 5px;
font-family: Verdana, Helvetica, sans-serif;
font-size: 18px;
color: #999;
-moz-border-radius: 5px 0px 0px 5px;
-webkit-border-radius: 5px 0px 0px 5px;
border-radius: 5px 0px 0px 5px;
-moz-box-shadow: inset 0px 0px 1px #444;
-webkit-box-shadow: inset 0px 0px 1px #444;
box-shadow: inset 0px 0px 1px #444;
border:1px solid #0F0;
float:left;
}
#searchform input[type='submit'] {
border: 1px solid #fff;
border-left: none;
height: 28px;
width: 28px;
background: #999 url(search.png) no-repeat center center;
-moz-border-radius: 0px 5px 5px 0px;
-webkit-border-radius: 0px 5px 5px 0px;
border-radius: 0px 5px 5px 0px;
border:1px solid #0F0;
margin:0px;
border:1px solid #0F0;
float:left;
}

#menu_label {
float:right;
-moz-transform: rotate(270deg);
-moz-transform-origin: 83% 60%;
-webkit-transform: rotate(270deg);
-webkit-transform-origin: 83% 60%;
color: #fff;
text-shadow: 0px 0px 3px #000;
font-weight: bold;
border:1px solid #0F0;
margin-left:240;
margin-bottom:100;
}

<div id="main_menu">
		<ul id="navigation">
			<li><a href="#">Главная</a></li>
			<li><a href="#">Галерея</a></li>
			<li><a href="#">Статьи</a></li>
			<li><a href="#">Новости</a></li>
			<li><a href="#">О нас</a></li>
			<li><a href="#">Контакты</a></li>
		</ul>
	<div id="searchbar">
		<form id="searchform" >
			<input type="text" name="search" />
			<input type="submit" value="" />
		</form>
	</div>
	<span id="menu_label" >МЕНЮ</span>
	</div>

938e5f97d08b4f838fa344839bbd8953.PNG
  • Вопрос задан
  • 2558 просмотров
Решения вопроса 1
@zdiii
Держите

P.S. "Решение" не забудьте
Ответ написан
Пригласить эксперта
Ответы на вопрос 2
romanzhak
@romanzhak
Mathematician
Вам нужно разобраться с плавающими объектами.
Ответ написан
dastiw1
@dastiw1
Frontend Developer
почему наши не пользуются jsfiddle.net
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
SummerWeb Ярославль
от 120 000 до 180 000 ₽
Brightdata Тель-Авив
от 5 500 до 6 500 $
Market-place Ростов-на-Дону
от 100 000 до 200 000 ₽
23 июн. 2024, в 07:31
600 руб./в час
23 июн. 2024, в 05:23
1500 руб./за проект