Фиксированное меню

<div id="wrapper"><!-- 650px -->
	<header><!-- position: fixed; width:100%; -->
		<div id="logo"><!-- float:left -->
			<img src="..." alt="">
		</div>
			
		<nav><!-- float:right -->
			<ul>
				<li><a href="">линк</a></li>
				<li><a href="">линк</a></li>
				<li><a href="">линк</a></li>
			</ul>
		</nav>
	</header>
</div>


Никак не могу решить проблему. Вроде бы div#wrapper имеет ширину 650px, но как только header'у делаю ширину 100%, хедер растягивает на всю ширину монитора (в моем случае 1230) ну и соответственно линки благополучно уезжают за пределы экрана, причем без полосы прокрутки.
  • Вопрос задан
  • 5302 просмотра
Решения вопроса 1
Да, проблема в position.
Значение fixed, как и absolute, выдирает элемент из потока и позиционирует его относительно всего окна.
Соответственно 100% — ширина всего окна.

Решением может быть применить position к #wrapper а не к header.
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
@ferasinka
Если я правильно вас понял, то необходимо убрать position: fixed;
Ответ написан
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы