Резиновая шапка

zalman · August 20, 2011

Здравствуйте! Проблема такая: Есть шапка сайта, по бокам которой слоем идут две колонны и в центре бэкграунд-имэйджем картинка с лого:

проблема в том, что, если разрешение монитора больше моего (1366px), то правая колонна остаётся на месте где-бы она находилась в развёрнутом окне на моём экране, а фон повторяется.

и ещё нужно, чтобы колонна была резиновой и при уменьшении окна браузера была прижата к его стенке, но не закрывая при этом логотип. желательно наверное, чтобы и то, что в центре растягивалось?

в чём проблема?

вот код:

СSS:

 body { background-image: url(img/fon.png);}



#outer_wrapper {
min-width:740px;
width:100%;
background:#fff url(left.gif) repeat-y left
}


#wrapper {
background:url(right.gif) repeat-y right
}

#header {

background-image: url(img/head2.png);
width:100%;
margin:0px
display:table;
}


#container {
float:left;
width:100%;
display:inline;
margin-left:-200px
}

Html

<body>

			<div id="outer_wrapper">
			<div id="wrapper">

			<div id="header">



				<div class="leftcollumn" style="float:left; width:300px;">  <img src="img/collumn1.png" alt=""> 	</div> <!-- /lcol-->
				<div class="rightcollumn" style="margin-left:1225px; ">  <img src="img/collumn1.png"  alt=""> 	</div> <!-- /lcol-->
			<div class="menu">
		<ul>
			<li><a href="#" >Главная</a></li>
			<li><a href="#" id="current">Услуги</a>
				<ul>
					<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>
					<li><a href="#">Педикюр</a></li>
			   </ul>
		  </li>
			<li><a href="/faq.php">Цены</a>
                <ul>
                <li><a href="#">s</a></li>
                <li><a href="#">s</a></li>
                <li><a href="#">s</a></li>
                <li><a href="#">s</a></li>
                </ul>
          </li>
			<li><a href="/contact/contact.php">Контакты</a></li>
		</ul>
	</div>
	</div> <!-- /lcol-->
			</div><!-- /header -->

Заранее спасибо!

sigma77 · August 21, 2011

zalman,

Ссылку на страницу бы...

zalman · August 21, 2011

http://rghost.ru/18730301

sigma77 · August 21, 2011

zalman,

Мне не нужна ссылка на архив. Дайте ссылку на саму страницу.

zalman · August 21, 2011

её нет в интернете ещё...

zalman · August 26, 2011

помогите пожалуйста!

orion_by · August 26, 2011

Я бы сделал как в примере (разбитие на 3 ячейки)только width: 500px; конечно же убрал, ну и подкорректировал под себя ширину левого и правого блока

zalman · August 28, 2011

спасибо большое! получилось!

Sign In

Резиновая шапка

Question

zalman

Link to comment

Share on other sites

7 answers to this question

Recommended Posts

sigma77

Link to comment

Share on other sites

zalman

Link to comment

Share on other sites

sigma77

Link to comment

Share on other sites

zalman

Link to comment

Share on other sites

zalman

Link to comment

Share on other sites

orion_by

Link to comment

Share on other sites

zalman

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information