макет 2 колонки

artylion · April 3, 2010

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Верстка сайта</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<meta name="description" content="описание" />
<meta name="keywords" content="ключевые слова" />
<style type="text/css">
* {	margin: 0;
	padding: 0;}

body {font: 12px/18px Arial, Tahoma, Verdana, sans-serif;}

img {border: none;}

#wrapper {margin: 0 auto;
		  min-width: 600px;
		  max-width: 800px;
		  width:expression(document.body.clientWidth < 600? "600px" : document.body.clientWidth > 800? "800px" : "auto");}

#header {height: 150px;
		 background: #ffe680;}

#container {float: left;
			width: 100%;}

#content {height: 400px;
		  background: #0cf;
		  margin-left: 200px;}

#left-column {width: 200px;
			  height: 300px;
			  background: #3c0;
			  float: left;
			  margin-left: -100%;}


#footer {height: 50px;
		 background:#f33;
		 clear: both;}
</style>

</head>
<body>
<div id="wrapper">
	<div id="header"></div>
	<div id="container">
	<div id="content">
	  </div>
	</div>
	<div id="left-column"><p>Привет!</p></div>
	<div id="footer"></div>
</div>
</body>
</html>

DjTarik · April 3, 2010

Всё дело в '-100%' для #left-column.

Есть два варианта:

1. Задать сайту ширину (для обертки? к примеру '1000px;') и поставить маржин в '-1000px;'

2. Можно подумать и найти решение для твоего случая ;-)

artylion · April 3, 2010

DjTarik said:
Всё дело в '-100%' для #left-column.
Есть два варианта:
1. Задать сайту ширину (для обертки? к примеру '1000px;') и поставить маржин в '-1000px;'
2. Можно подумать и найти решение для твоего случая ;-)

С фиксированной шириной все работает, мне надо чтоб тянулась правая колонка.

DjTarik · April 3, 2010

Ну причину я тебе назвал. Решение очень простое. Оно есть. Сам пару недель назад это делал.

artylion · April 3, 2010

DjTarik said:
Ну причину я тебе назвал. Решение очень простое. Оно есть. Сам пару недель назад это делал.

и какое решение?

Sign In

макет 2 колонки

Question

artylion

Link to comment

Share on other sites

4 answers to this question

Recommended Posts

DjTarik

Link to comment

Share on other sites

artylion

Link to comment

Share on other sites

DjTarik

Link to comment

Share on other sites

artylion

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information