IE 7 не поддается выравниванию

LLIo6oH · March 21, 2009

Помогите плиз..Мучаюсь вот уже который день...есть код....

<!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>BusWorld 2010: Нижегородская область</title>
<style type="text/css">

body {
			background-color:#7c7057;
			margin: 0;
			padding: 0;
			color: #000;
			text-align: center;
			font: normal 13px/1.4em Verdana, Arial, Helvetica, sans-serif;

		}
		img {
		   vertical-align: top;
		   border: none;
		}
		div {
		  margin: 0;
		  padding: 0;
		}

		td {
		padding-left:20px;
		padding-right:20px;
		}
		a{
		color:#FFFFFF;
		}
		a:active {
			color:#c9a603;
		}
		a:hover {
			color:#c9a603;
			text-decoration: none;
		}
		}
		h3, h4 {
			color:#c9a603;
			}
		#body {
		width:1000px;
		}
		#top_col {
			background-color:#7c7057;
		   width: 1000px;
		   position: relative;
		   white-space: nowrap;
		}
		#top_box {
	width: 1000px;
	height: 230px;
	background: url(images/top.jpg); 
   }
		#busworld {
			width: 350px;
			height: 206px;
			background:url(images/logo_busworld.png);
			position: absolute;
			left: 0;
			top: 0;
			margin-left:649px;
			margin-top:29px;
			z-index: 10;
		}
		#menu {
			width: 999px;
			height: 41px;
			background:url(images/menu.png);
			position: absolute;
			left: 0;
			top: 0;
			margin-left:0px;
			margin-top:232px;
			z-index: 5;
		}

		#logo_yarmarka{
			width: 144px;
			height: 146px;
			background:url(images/logo_yarmarka.png);
			position: absolute;
			left: 0;
			top: 0;
			margin-left:25px;
			margin-top:183px;
			z-index: 50;
		}
		#text_menu {
			font-family:Verdana, Arial, Helvetica, sans-serif;
			margin-left:90px;
			font-weight:bold;
			color:#FFFFFF;
			}
		#content {
			color:#FFFFFF;
			width:1000px;
			position:relative;
			margin:0;
		}
		#left_menu {
			text-align:left;
			position:absolute;
			width:20%;
			margin:0px;
			font-family:Verdana, Arial, Helvetica, sans-serif;
			padding-top:100px;
			padding-left:0px;
			}
		#text {
			text-align:right;
			position:absolute;
			width:60%;
			margin:0px;
			font-family:Verdana, Arial, Helvetica, sans-serif;
			padding-top:100px;
			padding-left:20%;
		}
		#right_col {
			position:absolute;
			width:20%;
			margin:0px;
			font-family:Verdana, Arial, Helvetica, sans-serif;
			padding-top:100px;
			padding-left:80%;
		}
		p {
			color:#000000;
		}


</style>
</head>


<body>
<center>

<!--[if lte IE 7]><><![endif]-->


<div id="top_col" >
			<div id="top_box">
				<div id="busworld"></div>
			</div>


		  <div id="text_menu">

					<table align="center">
						<tr><td></td></tr>
					  <tr><td></td></tr>
						<tr>
							<td align="center"><a href="Index.html">Главная</a></td> 
							<td align="center"><a href="oblast.html">Нижегородская обл.</a></td> 
							<td align="center"><a href="gorod.html">Н.Новгород</a></td> 
							<td align="center"><a href="yarmarka.html">Ярмарка</a></td> 
							<td align="center"><a href="busworld.html">BusWorld 2010</a></td>
					  </tr>
			</table>
				</div>


			<div id="logo_yarmarka">

			</div>
</div>



<div id="content">
	<div id="left_menu">
		<h4><font color="#c9a603">Нижегородская область</font></h4>

		<ul>
			<li><a href="history.html">История области</a></li>
				<li>Крупные города</li>
					<ul type="circle">
						<li><a href="arzamas.html">Арзамас</a></li>
						<li><a href="dust.html">Дзержинск</a></li>
						<li><a href="bor.html">Бор</a></li>
						<li><a href="viksa.html">Выкса</a></li>
						<li><a href="pavlovo.html">Павлово</a></li>
						<li><a href="zavolge.html">Заволжье</a></li>
					 </ul>
			<li>Достопримечательности</li>
		 		<ul type="circle">
					 	<li><a href="boldino.html">Болдино</a></li>
						<li><a href="diveevo.html">Дивеево</a></li>
						<li><a href="voskresenskoe.html">Воскресенское</a></li>
					 </ul>
		</ul> 
	</div>

	<div id="text">
	<h3><font color="#c9a603">Нижегородская область</font></h3>
	<img src="images/map.png">
	<a id="flash" href="flash.html" target="_blank">Просмотреть ролик полностью >>></a>
	</div>

	<div id="right_col">
	<h4><font color="#c9a603">Факты</font></h4>

<br>

<p>Столица: </p><br> Нижний Новгород <br><br>
<p>Площадь: </p> <br> 2000 га <br><br>
<p>Население: </p> <br>1 500 000 человек <br>
<p>Герб: </p> <br> <img src="images/gerb.png">
	</div>



</div>

</center>
</body>
</html>

В опере и FF нижние колонки left_menu, text и right_col отображаются нормально как и должно быть не вылазяя никуда.....в ИЕ 7 (может и вдругих версиях тоже) они смещаются вправо, так что left_menu стоит посередине экрана....

Что я сделал не так?

LLIo6oH · March 21, 2009

Уже не надо...разобрался сам...

yopopt · March 21, 2009

Макет построен на абсолютном позицировании. То есть вы везде напрописывали position: absolute; а вот куда его ставить не указали. Добавьте в #left_menu, #text, #right_col свойство left: 0;.

Sign In

IE 7 не поддается выравниванию

Question

LLIo6oH

Link to comment

Share on other sites

2 answers to this question

Recommended Posts

LLIo6oH

Link to comment

Share on other sites

yopopt

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information