в файрфоксе все отлично, а в ИЕ - все разламывается

dangler · April 6, 2009

такая проблема - сверстал страничку таблицами в хтмл, ну немного цсс еще в голове добавил. в файрфоксе все смотрится отлично -

однако, при открытии в ИЕ этот сраный браузер зачем все нахрен наперекосяк сдвигает - логотип разламывается, вырание по центру сбивается, половина текста куда-то пропадет..

подскажите, пожалуйста, если кто знает, из-за чего это может быть..

вот код страницы:

<html>
<head>
<title>Наружная реклама с расчетами по бартеру</title>

<style type="text/css">

body {
	background: #ffffff;
	margin: 0; 
	padding: 0;
	spacing: 0;
}

a {
	text-decoration: underline;
	font-family: Verdana, Tahoma, Arial, sans-serif;

}

a:hover {

	text-decoration: none;
	font-family: Verdana, Tahoma, Arial, sans-serif;
}

a.info {
	font-family: Verdana, Tahoma, Arial, sans-serif;
	color: #ffffff;
	}


a.info:hover {
	font-family: Verdana, Tahoma, Arial, sans-serif;
	color: #ffffff;
	text-decoration: none;
	}

.headl {

	padding: 0;
	margin: 28;
	font-weight: bold;
	color: red;
	border-bottom: 2px solid #0051ca;

}


ul {
	display: block;
	padding:0;
	margin:0;
}

ul li {
	color: red;
	padding:0;
	margin:0 0 12px 16px;

}

ul li span {
	font-family: Verdana, Tahoma, Arial, sans-serif;
	font-size: 12px;
	color: #444444;
	display: block;
	margin: 12px;
}

</style>

</head>

<body text="#444444">


<table width="100%" height="100%" cellspacing="0" cellpadding="0">


<tr height="167">
<td  colspan=3 background="top_ed.jpg" align=center valign=bottom>
</td>
</tr>

<tr height="36" valign=center align=center>

<td bgcolor="#5d6f5f" align=right valign=center>
<font color="ffffff" face="Verdana, Tahoma, Arial, sans-serif" size="4"><strong>     НАРУЖНАЯ РЕКЛАМА   </strong></font>
</td>

<td bgcolor="#5d6f5f" align=center width="72" height="36">

<img src="logo1.jpg" alt="" width="72" height="36" border="0">
</td>

<td bgcolor="#5d6f5f" align=left valign=center>
<font color="ffffff" face="Verdana, Tahoma, Arial, sans-serif" size="4"><strong>   С РАСЧЕТАМИ ПО БАРТЕРУ</strong></font>
</td>
</tr>

<tr height="36" align=center>
<td>    </td>
<td align=center width="72" height="36">
<img src="logo2.jpg" alt="" width="72" height="36" border="0">
</td>
<td>    </td>
</tr>


<tr valign=top>
<td colspan=3 valign=top align=center>

<table width="90%" height="100%" cellspacing="0" cellpadding="0">

<tr valign=top align=center>
<td align=center>

<font face="Verdana, Tahoma, Arial, sans-serif" size="3" color="283891">
<strong>Уважаемые Господа!<br>
Компания НИКЭ, один из крупнейших операторов на рынке наружной рекламы,<br>
представляет Вам специальное предложение:<br>
</strong></font>
</td>
</tr>

<tr>
<td>

<table width="100%" height="100%" border="0" cellpadding="20" cellspacing="0">

<tr valign=top>
<td width="50%">

<font face="Verdana, Tahoma, Arial, sans-serif" size="2">

<span class="headl">ВЫ ПОЛУЧАЕТЕ</span><p>

<ul>
 <li><span>Высокоэффективную наружную рекламу Вашего автосалона, за которую Вам не нужно платить деньгами (расчет по бартеру исходя из соотношения цены Вашей продукции и наших услуг).</span></li>
 <li><span>Безусловное преимущество над конкурентами, которые в период кризиса вынуждены сокращать объемы своей наружной рекламы.</span></li>

<table width="100%" height="100%" border="0" cellpadding="4" cellspacing="0">
<tr valign=center>
<td align=center>
<img src="exclam.jpg" alt="" width="36" height="37" border="0">
</td>
<td>
<font size="2" color="283891"><strong>Покупатель выбирает того продавца, который всегда на виду и на слуху.</strong></font>
</td>
</tr>
</table>

 <li><span>Распространение информации о Вашем автосалоне среди Ваших прямых и главных покупателей — автолюбителей и автовладельцев.</span></li>

<table width="100%" height="100%" border="0" cellpadding="4" cellspacing="0">
<tr valign=center>
<td align=center>
<img src="exclam.jpg" alt="" width="36" height="37" border="0">
</td>
<td>
<font size="2" color="283891"><strong>Именно водители и пассажиры — основная аудитория наружной рекламы.</strong></font>
</td>
</tr>
</table>

 <li><span>На Ваш выбор – любая наружная реклама: популярные биллборды, внушительные суперсайты, а также перетяжки, арки, пилоны, брандмауэры и крышные установки.</span></li></ul><p>


<span class="headl">МЫ ПРЕДОСТАВЛЯЕМ ВАМ</span><p>

<ul>
 <li><span>Рекламные поверхности в Москве, Московской области и регионах России (по объему собственной рекламной сети мы входим в российский ТОП-10 операторов наружной рекламы).</span></li>
 <li><span>Подбор выгодной для Вас адресной программы размещения Вашей рекламы.</span></li>
 <li><span>Дизайн Ваших рекламных постеров.</span></li>
 <li><span>Монтаж рекламных материалов, полный сервис и мониторинг размещения рекламы на весь период кампании.</span></li>
</ul>
</td>
<td>

<table width="100%" height="100%" border="0" cellpadding="12"  bgcolor="#f8f8e2" cellspacing="0">

<tr>
<td align=center>

<img src="fig1.gif" alt="Круговорот автомобилей в рекламе" width="240" height="277" border="0">

</td>
</tr>


<tr>
<td>

<font face="Verdana, Tahoma, Arial, sans-serif" size="2">

<font color="red"><strong>КОМПАНИЯ НИКЭ</strong></font><p>
- крупнейший игрок на рынке наружной рекламы России, один из старейших и известнейших операторов в отрасли;<br>
- ответственный подрядчик, выполняющий свои обязательства качественно и в срок.<p>
В компании накоплен огромный опыт размещения рекламы автопроизводителей и автодилеров.<br>
Отличительная особенность нашей работы с клиентами – не договоры по шаблону и «на поток», а предоставление самых интересных индивидуальных условий конкретным клиентам.

</font>

</td>
</tr>


</table>

</td>
</tr>
</table>

</td>

</tr>

</td>
</tr>
</table>



<tr valign=bottom height="124">

<td colspan=3 background="bottom.jpg" valign=bottom align=center>

<font face="Verdana, Tahoma, Arial, sans-serif" size="2">
Подробная информация о специальном предложении компании НИКЭ — у начальника отдела<br>
продаж Натальи Пироговой, эл. почта: <a href="mailto:pirogova@nike-outdoor.ru">pirogova@nike-outdoor.ru</a><br>
127287, Москва, ул. 2-я Хуторская, 38А, корп. 23, 5-й этаж. Тел: (495) 921-22-90 E-mail: <a href="mailto:ra@nike-outdoor.ru">ra@nike-outdoor.ru</a></font><br>
 
</td>

</tr>


</table>
</body>
</html>

забыл картинку, как ИЕ все домает - вот:

sc@r@bey · April 6, 2009

ослепнуть можно от такого кода, попробуй

<html>
<head>
<title>Наружная реклама с расчетами по бартеру</title>

<style type="text/css">

body {
	background: #ffffff;
	margin: 0;
	padding: 0;
	spacing: 0;
}

a {
	text-decoration: underline;
	font-family: Verdana, Tahoma, Arial, sans-serif;

}

a:hover {

	text-decoration: none;
	font-family: Verdana, Tahoma, Arial, sans-serif;
}

a.info {
	font-family: Verdana, Tahoma, Arial, sans-serif;
	color: #ffffff;
	}


a.info:hover {
	font-family: Verdana, Tahoma, Arial, sans-serif;
	color: #ffffff;
	text-decoration: none;
	}

.headl {

	padding: 0;
	margin: 28;
	font-weight: bold;
	color: red;
	border-bottom: 2px solid #0051ca;

}


ul {
	display: block;
	padding:0;
	margin:0;
}

ul li {
	color: red;
	padding:0;
	margin:0 0 12px 16px;

}

ul li span {
	font-family: Verdana, Tahoma, Arial, sans-serif;
	font-size: 12px;
	color: #444444;
	display: block;
	margin: 12px;
}

</style>

</head>

<body text="#444444">


<table width="100%" height="100%" cellspacing="0" cellpadding="0">


<tr height="167">
<td  colspan=3 background="top_ed.jpg" align="center" valign="bottom">
</td>
</tr>

<tr height="36" valign="center" align="center">

<td bgcolor="#5d6f5f" align="right" valign="center">
<font color="ffffff" face="Verdana, Tahoma, Arial, sans-serif" size="4"><strong>	 НАРУЖНАЯ РЕКЛАМА   </strong></font>
</td>

<td style="background: #5d6f5f url(logo1.jpg) no-repeat center" align="center" width="72" height="36">
 
</td>

<td bgcolor="#5d6f5f" align="left" valign="center">
<font color="ffffff" face="Verdana, Tahoma, Arial, sans-serif" size="4"><strong>   С РАСЧЕТАМИ ПО БАРТЕРУ</strong></font>
</td>
</tr>

<tr height="36" align="center">
<td>  </td>
<td style="background: url(logo2.jpg) no-repeat center" align="center" width="72" height="36">

</td>
<td>  </td>
</tr>


<tr valign="top">
<td colspan=3 valign="top" align="center">

<table width="90%" height="100%" cellspacing="0" cellpadding="0">

<tr valign="top" align="center">
<td align="center">

<font face="Verdana, Tahoma, Arial, sans-serif" size="3" color="283891">
<strong>Уважаемые Господа!<br>
Компания НИКЭ, один из крупнейших операторов на рынке наружной рекламы,<br>
представляет Вам специальное предложение:<br>
</strong></font>
</td>
</tr>

<tr>
<td>

<table width="100%" height="100%" border="0" cellpadding="20" cellspacing="0">

<tr valign="top">
<td width="50%">

<font face="Verdana, Tahoma, Arial, sans-serif" size="2">

<span class="headl">ВЫ ПОЛУЧАЕТЕ</span><p>

<ul>
<li><span>Высокоэффективную наружную рекламу Вашего автосалона, за которую Вам не нужно платить деньгами (расчет по бартеру исходя из соотношения цены Вашей продукции и наших услуг).</span></li>
<li><span>Безусловное преимущество над конкурентами, которые в период кризиса вынуждены сокращать объемы своей наружной рекламы.</span></li>

<table width="100%" height="100%" border="0" cellpadding="4" cellspacing="0">
<tr valign="center">
<td align="center">
<img src="exclam.jpg" alt="" width="36" height="37" border="0">
</td>
<td>
<font size="2" color="283891"><strong>Покупатель выбирает того продавца, который всегда на виду и на слуху.</strong></font>
</td>
</tr>
</table>

<li><span>Распространение информации о Вашем автосалоне среди Ваших прямых и главных покупателей — автолюбителей и автовладельцев.</span></li>

<table width="100%" height="100%" border="0" cellpadding="4" cellspacing="0">
<tr valign="center">
<td align="center">
<img src="exclam.jpg" alt="" width="36" height="37" border="0">
</td>
<td>
<font size="2" color="283891"><strong>Именно водители и пассажиры — основная аудитория наружной рекламы.</strong></font>
</td>
</tr>
</table>

<li><span>На Ваш выбор – любая наружная реклама: популярные биллборды, внушительные суперсайты, а также перетяжки, арки, пилоны, брандмауэры и крышные установки.</span></li></ul><p>


<span class="headl">МЫ ПРЕДОСТАВЛЯЕМ ВАМ</span><p>

<ul>
<li><span>Рекламные поверхности в Москве, Московской области и регионах России (по объему собственной рекламной сети мы входим в российский ТОП-10 операторов наружной рекламы).</span></li>
<li><span>Подбор выгодной для Вас адресной программы размещения Вашей рекламы.</span></li>
<li><span>Дизайн Ваших рекламных постеров.</span></li>
<li><span>Монтаж рекламных материалов, полный сервис и мониторинг размещения рекламы на весь период кампании.</span></li>
</ul>
</td>
<td>

<table width="100%" height="100%" border="0" cellpadding="12"  bgcolor="#f8f8e2" cellspacing="0">

<tr>
<td align="center">

<img src="fig1.gif" alt="Круговорот автомобилей в рекламе" width="240" height="277" border="0">

</td>
</tr>


<tr>
<td>

<font face="Verdana, Tahoma, Arial, sans-serif" size="2">

<font color="red"><strong>КОМПАНИЯ НИКЭ</strong></font><p>
- крупнейший игрок на рынке наружной рекламы России, один из старейших и известнейших операторов в отрасли;<br>
- ответственный подрядчик, выполняющий свои обязательства качественно и в срок.<p>
В компании накоплен огромный опыт размещения рекламы автопроизводителей и автодилеров.<br>
Отличительная особенность нашей работы с клиентами – не договоры по шаблону и «на поток», а предоставление самых интересных индивидуальных условий конкретным клиентам.

</font>

</td>
</tr>


</table>

</td>
</tr>
</table>

</td>

</tr>

</td>
</tr>
</table>



<tr valign="bottom" height="124">

<td colspan=3 background="bottom.jpg" valign="bottom" align="center">

<font face="Verdana, Tahoma, Arial, sans-serif" size="2">
Подробная информация о специальном предложении компании НИКЭ — у начальника отдела<br>
продаж Натальи Пироговой, эл. почта: <a href="mailto:pirogova@nike-outdoor.ru">pirogova@nike-outdoor.ru</a><br>
127287, Москва, ул. 2-я Хуторская, 38А, корп. 23, 5-й этаж. Тел: (495) 921-22-90 E-mail: <a href="mailto:ra@nike-outdoor.ru">ra@nike-outdoor.ru</a></font><br>
 
</td>

</tr>


</table>
</body>
</html>

учи матчасть, даже табличной верской такой код можно сделать намного меньше и чише!

Edited April 6, 2009 by sc@r@bey

Gamer · April 6, 2009

Матчасть

dangler · April 7, 2009

sc@r@bey, спасибо! хоть логотип теперь не разламывается.. )

правда теперь выравнивание не по центру смещается:

-как я понимаю, потому что надписи "НАРУЖНАЯ РЕКЛАМА" и "С РАСЧЕТАМИ ПО БАРТЕРУ" - разной длины. я как раз неразрывными пробелами пытался уровнять их длину, чтобы по центру было.. )

и ИЕ по-прежнему почему-то плохо реагирует на левую колонку центральной таблицы:

как я понимаю, это связано с тем, что я картинки туда вставил.. но мозила-то нормально их воспринимает..

эх, и правда, надо учить матчасть, но, вы думаете - яне учил? учу, уже года 3 назад начал хтмл учить.. пишу код в блокноте, проверяю хтмл в мозиле - все работет вроде.. а в ИЕ открываешь - и прям руки опускаются..

а пока буду дальше учить, может кто-нибудь подсказать, что там не так?

Nekromancer · April 7, 2009

<html>
<head>

а где доктайп?

dangler · April 7, 2009

nekromancer, ну добавил я сверху

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

вроде такой у меня тип.. только ничего не изменилось.. често, я читал статьи про этот доктайп, чт он важен, только вот ни разу не видел, что от его добавления/убавления что-то изменилось.. )

Justnewone · April 7, 2009

nekromancer, ну добавил я сверху
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
вроде такой у меня тип.. только ничего не изменилось.. често, я читал статьи про этот доктайп, чт он важен, только вот ни разу не видел, что от его добавления/убавления что-то изменилось.. )

Добавьте правильный доктайп и наверняка увидите. Добавление такого как у Вас доктайпа не выводит браузер из режима совместимости со старыми браузерами.

Searcher · April 7, 2009

со ссылкой должен быть: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

dangler · April 7, 2009

Justnewone, Searcher, о, кстати, действительно частично работает:

правда выравнивание по центру почему-то стало в списке.. И оступы между строками списка ИЕ делает больше, чем мозила.. хотя все отступы в цсс заданы.. )

а мозила, кстати, после добавления доктайпа тоже изменил вид:

почему-то сделал весь текст серым, не реагируя на теги font и убрал абзацный отступ у заголовка "вы получаете", хотя он спаном задан.. хм..

p.s. - в этом сообщении - первая картинка из эксплоера, вторая - из мозилы. как было в самом начале в мозиле - см. в самом первом сообщении в этой теме.

Searcher · April 7, 2009

По стандартам все оформление должно быть в CSS, а HTML - только структура и контент. Так что тэги font, center и параметры у тэгов типа color, align и т.п. устарели. Все это есть в CSS. На сайте htmlbook.ru есть прекрасный справочник по CSS. Читайте, изучайте.

И как это отступ задан спаном? Заголовки нужно заключать в тэги <h1></h1>, <h2></h2> и т.д. в зависимости от уровня, и задавать этим тэгам стили с оформлением и отступами, какие вам нужны.

Sign In

в файрфоксе все отлично, а в ИЕ - все разламывается

Question

dangler

Link to comment

Share on other sites

9 answers to this question

Recommended Posts

sc@r@bey

Link to comment

Share on other sites

Gamer

Link to comment

Share on other sites

dangler

Link to comment

Share on other sites

Nekromancer

Link to comment

Share on other sites

dangler

Link to comment

Share on other sites

Justnewone

Link to comment

Share on other sites

Searcher

Link to comment

Share on other sites

dangler

Link to comment

Share on other sites

Searcher

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information