Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
Форум программистов > Вёрстка веб-сайтов > Проблемы с высотой элемента в разных браузерах


Автор: CMD 1.8.2006, 20:03
Подскажите пожалуйста как сделать, чтоб страничка во всех броузерах(по крайней мере в IE, Opera, Firefox) смотрелась одинакого как например http://www.adobe.com/misc/copyright.html : они используют тэг <p>, однако как я не пробывал, во всех браузерах высота между параграфами разная, т.е. страничка одного и того же текста в IE занимает половину страницы в Opera. Был такой вариант, в таблице стилей настроить <p>:
Код
p{margin-top:10px; margin-bottom:10px}


но высота остаётся прямопропорциональна браузеру
Потом решил с помощью яваскрипта проверять броузер, и выставлять значения margin-top и margin-bottom: броузер определяет, а как параметры менять я не знаю, помогите пожалуйста разобраться. smile 

Автор: ZlojEzh 2.8.2006, 16:09
Код

p {line-height:1.5em;}

Автор: CMD 2.8.2006, 16:34
Нет, как я понял у этого тэга по умолчанию разные параметры у разных браузеров, то есть параметр, который задаёш какбы добавляется к тому, что стоит в броузере по умолчанию, вобщем страничка выглядит всёравно по-разному. smile 

Автор: ZlojEzh 4.8.2006, 10:56
по поводу ява-скрипта для изменения параметров:
Код

document.getElementById('p_id').style.lineHeight = 'браузер*навороченный_коэфициент_отступа_)';

Автор: Illuminaty 4.8.2006, 12:18
вот пример:
Код
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Проблемы с высотой элемента в разных браузерах</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<style type="text/css">
p {
    background-color:#339966;
    margin: 10px 0px;
    padding: 0px;
    line-height: 20px;
}
body {
    margin: 0px;
    padding: 0px;
}
</style>
</head>
<body>
<p>
Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 
Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 
Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 
Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 Бла1 
</p>
<p>
Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 
Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 
Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 
Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2 Ба2
</p>
<p>
Бла3 Бла3 Бла3 Бла3 Бла3 Бла3 Бла3 Бла3 Бла3 Бла3 
Бла3 Бла3 Бла3 Бла3 Бла3 Бла3 Бла3 Бла3 Бла3 Бла3 
Бла3 Бла3 Бла3 Бла3 Бла3 Бла3 Бла3 Бла3 Бла3 Бла3 
Бла3 Бла3 Бла3 Бла3 Бла3 Бла3 Бла3 Бла3 Бла3 Бла3 
</p>
</body>
</html>

Расстояния одинаковые (специально измерял). Для полной идентичности отображения нужно еще и шрифты жестко задать.

Эта проблема возникает при использовании стилей по умолчанию.

Автор: CMD 6.8.2006, 20:36
Огромное человеческое спасибо Illuminaty!! Просто возродил мою веру в людей! Если будут вопросы по с++, обращайся.




Тема Закрыта.

Автор: Illuminaty 6.8.2006, 20:54
Рад был помочь smile 

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)