Позиционирование в HTML

Дядя Ваня · 21 Авг 2009

Вроде все браузеры всё правильно показывают а Пожалуйста зарегистрируйся для просмотра данной ссылки на страницу. чёт мудрит. И не пойму почему Пожалуйста зарегистрируйся для просмотра данной ссылки на страницу. так выглядит?
научите пожалуйста чайнику как правильно в HTML позиционировать

dust · 23 Авг 2009

Привет , тебе нужно почитать книгу по ЦСС особенно пункт про zweispaltige Layout, извени но обяснять будет долго - одно скажу если позиционируешь
два блок элемента один за другим, то надо один сделать float:left другой float:right и обязателно задать им параметры width .
Я вот тебе набросал быстро W3c валидный HTML layout для твоей страницы.

PHP

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


	<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title></title>
<meta name="description" content="" />
<meta name="keywords" content="" />
<meta http-equiv="Language" content="de" />
<meta name="robots" content="INDEX,FOLLOW" />
<meta name="geo.region" content="DE-BY" />
<meta name="geo.placename" content="Nuernberg" />
<meta name="geo.position" content="51.165691;10.451526" />
<meta name="ICBM" content="51.165691, 10.451526" />
<link rel="shortcut icon" href="images/favicon.ico" />
<link rel="stylesheet" type="text/css" media="screen,projection" href="css/layout.css" />




<style type="text/css">




* {	PADDING-RIGHT: 0px;	PADDING-LEFT: 0px;	PADDING-BOTTOM: 0px;	MARGIN: 0px;	PADDING-TOP: 0px}
BODY {	FONT-SIZE: 12px;	BACKGROUND: url(http://www.amphibian-divers.com/ru/images/bg.jpg);	COLOR: #666666;	FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif}
.clear {	CLEAR: both}
#wrap {	BACKGROUND: url(http://www.amphibian-divers.com/ru/images/wrapbg.jpg) repeat-y;	MARGIN: 25px auto;	WIDTH: 927px}
#wrap #header #sitename {	PADDING-RIGHT: 50px;	DISPLAY: block;	FONT-WEIGHT: normal;	FONT-SIZE: 58px;	COLOR: #ffffff;	PADDING-TOP: 140px;	FONT-FAMILY: Georgia, "Times New Roman", Times, serif;	TEXT-ALIGN: center}
#header {	BACKGROUND: url(http://www.amphibian-divers.com/ru/images/header.jpg) no-repeat;	HEIGHT: 160px}
#info {	BACKGROUND: url(http://www.amphibian-divers.com/ru/images/info.jpg) no-repeat;	HEIGHT: 30px}
#page {	PADDING-RIGHT: 10px;	PADDING-LEFT: 10px;	PADDING-BOTTOM: 0px;	PADDING-TOP: 0px}
#menu {	BACKGROUND: url(http://www.amphibian-divers.com/ru/images/sidemenu.jpg) no-repeat;	WIDTH: 269px;	HEIGHT: 382px;float:left;}
#footer {	BACKGROUND: url(http://www.amphibian-divers.com/ru/images/footer.jpg) no-repeat 50% bottom;	HEIGHT: 50px;	TEXT-ALIGN: center}
#content { width:630px;margin:0px;padding:0px; float:right;}
h1 {
	text-align:center;
}
</style>
</head>
<body>
	<div id="wrap">
		<div id="header"></div>
		<div id="info"><h1>Info</h1></div>
		<div id="page">
			<div id="menu"></div>
			<div id="content"><h1>Text</h1></div>
			<div class="clear">&nbsp;</div>
		</div>
		<div id="footer"><h1>Footer</h1></div>
	</div>
</body>
</html>

Показать весь код

Дядя Ваня · 23 Авг 2009

@ dust!
при помощи float:right MSIE6.0 больше не мудрит.
Спасибо тебе большое!!!
не подскажешь почему "footer" всех слушает а информеры ему до лампочки?

Поделиться