CSS, float

Уберите height: 200px для .post1 и .post2 и высота будет подогнана под содержимое дивов.
Всё получилось, ещё раз спасибо за помощь :)

А вот ещё, почему-то блок с авторизацией потерялся.
Для #main в css добавьте vertical-align: top.
Или же высоту для меню задать.
Должно помочь.
edevyatkin
Для #main в css добавьте vertical-align: top.
Или же высоту для меню задать.
Должно помочь.
Нет, не помогло :( Пробовал и так и так, и всё вместе.
Всё ещё актуально?
Нет.
P.S. Но для собственного развития буду благодарен за правильное решение :)
В общем случае это должно выглядеть как-то так:

<!DOCTYPE HTML>
<html lang="ru">
<head>
	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
	<title></title>
	<style>
		.b-page {
			min-width: 1000px;
			position: relative;
			}
		.b-login {
			background: #ccc;
			position: absolute;
			top: 0;
			left: 50%;
			margin-left: 300px;
			width: 200px;
			}
		.b-page__header {
			width: 500px;
			margin: 0 auto;
			}
		.b-content {
			width: 500px;
			margin: 0 auto;
			}
		.b-article {
			background: #ccc;
			}
	</style>
</head>
<body class="b-page">
<div class="b-login">
	<p>Привет, гость!</p>
</div>
<h1 class="b-page__header">Заголовок</h1>
<div class="b-content">
	<article class="b-article">
		<h1>Заголовок записи</h1>
		<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed varius tellus ac massa porttitor elementum vitae eu sem. Aenean ut sem in mi condimentum vehicula id sit amet velit. Sed condimentum, enim ornare feugiat posuere, erat massa consectetur lacus, sed vulputate sem nisl quis tortor. Nam mauris neque, imperdiet a convallis eu, aliquet sit amet felis. Etiam elementum ullamcorper nibh, sit amet aliquet elit hendrerit sit amet. Nulla facilisi. Maecenas venenatis sapien sit amet augue dictum aliquam. Etiam sollicitudin, massa eget sodales posuere, nulla velit semper dolor, pulvinar fringilla lacus purus a urna. Suspendisse potenti. Phasellus sit amet arcu non augue fringilla tristique. Quisque eget lectus id quam varius euismod id sed nisl. Praesent at turpis ante, et facilisis lorem. Cras pulvinar elementum accumsan.</p>
	</article>
	<article class="b-article">
		<h1>Заголовок записи</h1>
		<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed varius tellus ac massa porttitor elementum vitae eu sem. Aenean ut sem in mi condimentum vehicula id sit amet velit. Sed condimentum, enim ornare feugiat posuere, erat massa consectetur lacus, sed vulputate sem nisl quis tortor. Nam mauris neque, imperdiet a convallis eu, aliquet sit amet felis. Etiam elementum ullamcorper nibh, sit amet aliquet elit hendrerit sit amet. Nulla facilisi. Maecenas venenatis sapien sit amet augue dictum aliquam. Etiam sollicitudin, massa eget sodales posuere, nulla velit semper dolor, pulvinar fringilla lacus purus a urna. Suspendisse potenti. Phasellus sit amet arcu non augue fringilla tristique. Quisque eget lectus id quam varius euismod id sed nisl. Praesent at turpis ante, et facilisis lorem. Cras pulvinar elementum accumsan.</p>
	</article>
</div>
</body>
</html>
или так:

<!DOCTYPE HTML>
<html lang="ru">
<head>
	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
	<title></title>
	<style>
		.b-page {
			width: 750px;
			padding-left: 250px;
			margin: 0 auto;
			}
		.b-login {
			background: #ccc;
			float: right;
			width: 200px;
			}
		.b-page__header {
			width: 500px;
			float: left;
			}
		.b-content {
			width: 500px;
			float: left;
			cleat: left;
			}
		.b-article {
			background: #ccc;
			}
	</style>
</head>
<body class="b-page">
<div class="b-login">
	<p>Привет, гость!</p>
</div>
<h1 class="b-page__header">Заголовок</h1>
<div class="b-content">
	<article class="b-article">
		<h1>Заголовок записи</h1>
		<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed varius tellus ac massa porttitor elementum vitae eu sem. Aenean ut sem in mi condimentum vehicula id sit amet velit. Sed condimentum, enim ornare feugiat posuere, erat massa consectetur lacus, sed vulputate sem nisl quis tortor. Nam mauris neque, imperdiet a convallis eu, aliquet sit amet felis. Etiam elementum ullamcorper nibh, sit amet aliquet elit hendrerit sit amet. Nulla facilisi. Maecenas venenatis sapien sit amet augue dictum aliquam. Etiam sollicitudin, massa eget sodales posuere, nulla velit semper dolor, pulvinar fringilla lacus purus a urna. Suspendisse potenti. Phasellus sit amet arcu non augue fringilla tristique. Quisque eget lectus id quam varius euismod id sed nisl. Praesent at turpis ante, et facilisis lorem. Cras pulvinar elementum accumsan.</p>
	</article>
	<article class="b-article">
		<h1>Заголовок записи</h1>
		<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed varius tellus ac massa porttitor elementum vitae eu sem. Aenean ut sem in mi condimentum vehicula id sit amet velit. Sed condimentum, enim ornare feugiat posuere, erat massa consectetur lacus, sed vulputate sem nisl quis tortor. Nam mauris neque, imperdiet a convallis eu, aliquet sit amet felis. Etiam elementum ullamcorper nibh, sit amet aliquet elit hendrerit sit amet. Nulla facilisi. Maecenas venenatis sapien sit amet augue dictum aliquam. Etiam sollicitudin, massa eget sodales posuere, nulla velit semper dolor, pulvinar fringilla lacus purus a urna. Suspendisse potenti. Phasellus sit amet arcu non augue fringilla tristique. Quisque eget lectus id quam varius euismod id sed nisl. Praesent at turpis ante, et facilisis lorem. Cras pulvinar elementum accumsan.</p>
	</article>
</div>
</body>
</html>
 
Зарегистрироваться или войдите чтобы оставить сообщение.