Проблема с макетом CSS в IE, работает почти нормально в Mozilla

Question

Я создавал сайт http://tapasya.co.in и обнаружил, что у этого сайта есть некоторые проблемы с макетом в IE 6, но он отлично работает в Mozilla.

Я хочу, чтобы этот сайт выглядел так же, как сейчас в Mozilla.

То, что мне нужно сделать в CSS, делает его идеальным.

В Mozilla также мало места между двумя рядами. Я не хочу это место. Каждая строка не должна иметь никакого поля

Пожалуйста, предложите, какие изменения мне нужно сделать в CSS.

Answer 1

IE6 расширяет пустые div до размера шрифта на тот случай, если вы когда-нибудь решите вставить в них текст.

Добавьте высоту строки: 0 и размер шрифта: от 0 до div.content1_dvider_div

#content1_bg div.content1_dvider_div {
   background:url("../Images/content1_div.gi") repeat-y scroll center center #EFEFEF;
   height:5px;
   margin:15px 0 0;
   line-height:0;
   font-size:0;

}

Answer 2

Простой поиск в Google привел бы вас сюда:

http://www.quirksmode.org/css/condcom.html

Что показывает, что вы должны использовать этот условный CSS. GL!

Answer 3

Я бы использовал условный CSS для каждой версии IE. Вы можете использовать «lt» (меньше чем) и «gt» (больше чем), чтобы настроить таргетинг на каждую версию, как показано ниже

<!--[if lt IE7]>
<link rel="stylesheet" type="text/css" href="ie6.css" />
<![endif]-->

<!--[if IE7]>
<link rel="stylesheet" type="text/css" href="ie7.css" />
<![endif]-->

<!--[if gt IE7]>
<link rel="stylesheet" type="text/css" href="ie8.css" />
<![endif]-->

После того, как у вас есть отдельные CSS-файлы для каждой версии IE, вам нужно будет заново указать свойства CSS, которые вызывают проблемы. В большинстве случаев это будут свойства margin и padding.

Если вы использовали float, то в IE6 запас в направлении float удвоится. См. ссылку для получения дополнительной информации об этом

это хороший набор инструментов для тестирования браузера здесь

Answer 4

IE не ведет себя так, как хочет дизайнер.Так что вам нужно использовать отдельные таблицы стилей для IE (не полный CSS, а те, которые создают проблемы в IE) и, наконец, поместить этот код в тег head head

<!--[if IE]>
<link rel="stylesheet" type="text/css" href="ie_style.css" />
<![endif]-->

и указать таблицу стилей IEв href