Отключен JavaScript

У вас отключен JavaScript. Некоторые возможности системы не будут работать. Пожалуйста, включите JavaScript для получения доступа ко всем функциям.

Зарегистрируйтесь для ответа в тему

Сайт отображается в разных браузерах по-разному

#21 yury

Пользователь
642 сообщений

Репутация: 188

Отправлено 12 Апрель 2012 - 21:27

Во-первых, для корректной верстки необходимо указывать доктайп, т.е. указание браузеру на каком языке и по какому стандарту вы верстаете.
Например, в моем последнем примере это строгий вариант XHTML 1.0

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

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

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

В-третьих, полезно в начале таблицы стилей обнулять _все_ поля и отступы вот так:

*{
  margin: 0;
  padding: 0;
}

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

В-четвертых...
ну пока достаточно :)

#22 Kolovrat

Topic Starter

Заблокированные
61 сообщений

Репутация: 0

Отправлено 12 Апрель 2012 - 21:38

и вот только что появился еще вопросик, но не по теме.
если не ошибаюсь тег <title></title> работает в теге <head></head>, я сейчас попробовал без этого тега и он сработал (этот код это как раз файл главной страницы который вставляется в контент)

<title>Главная</title>
<div id="gl_l"></div><div id="gl_r"></div>

на счет третьего пункта: я обнулил но только margin, самое первое в css body и этот стиль боди я применил к тегу body в html коде (не думайте что у меня фантазия плохая, просто чтоб не путаться одинаковые делал

) а вот про padding я забыл =) ща добавлю =)

на счет доктайпа: нашел чуть раньше урок по верстке и там прочитал про эту тему, но после того как я его вставлял в код ни че не отображалось. хотя я вставлял доктайп соответствующий стандартному html и еще какому то такому а для xhtml не пробовал. ща попробую

а вот на счет пикселей и процентов я лично запутался

я не понимаю что процент это относительная величина, а пиксель "твердая", но че то путаюсь

попробовал вставить ваш доктайп и произошла та же чушь =( почему то все изчезло и осталась только обводка тех двух блоков внутри контента =(

#23 yury

Пользователь
642 сообщений

Репутация: 188

Отправлено 12 Апрель 2012 - 21:39

и вот только что появился еще вопросик, но не по теме.

Kolovrat,
вообще-то язык HTML весьма терпимый к вольностям, а большинство браузеров устроены так, что попытаются отобразить даже очень кривой код и даже исправить кривизну, в меру своего искусственного интеллекта. А могут и не исправить.
Но вам ведь хочется научиться делать грамотную верстку без потенциальных косяков, а не испытывать возможности ИИ браузеров по исправлению ваших ошибок?
Так что сначала научитесь верстать без ошибок и по стандартам. Поверьте, если их просто соблюдать, то верстать вам будет не сложнее чем просто писать на форуме. А вот экспериментировать советую попозже, когда основам научитесь.

#24 Kolovrat

Topic Starter

Заблокированные
61 сообщений

Репутация: 0

Отправлено 12 Апрель 2012 - 21:45

yury, спасибо за совет) тогда еще вопрос. вот например именно этот случай. я вставляю файлик в страницу в котором у меня хранится определенный текст для контента и имя этой страницы. получается что мне лучше писать все нужные теги (<html> <head> <body>) или все таки хватит только самых необходимых? просто хочу оформить так чтоб в дальнейшем можно было с легкостью быстро добавлять новые файлы и не писать лишние теги

#25 yury

Пользователь
642 сообщений

Репутация: 188

Отправлено 12 Апрель 2012 - 22:00

на счет третьего пункта: я обнулил но только margin, самое первое в css body и этот стиль боди я применил к тегу body в html коде (не думайте что у меня фантазия плохая, просто чтоб не путаться одинаковые делал ) а вот про padding я забыл =) ща добавлю =)

Вы обнулили margin _только_ для body:

#body
{
margin: 0px;
}

я же вам посоветовал обнулить _все_ отступы и поля:

*{
margin: 0px;
padding: 0px;
}

на счет доктайпа: нашел чуть раньше урок по верстке и там прочитал про эту тему, но после того как я его вставлял в код ни че не отображалось. хотя я вставлял доктайп соответствующий стандартному html и еще какому то такому а для xhtml не пробовал. ща попробую
попробовал вставить ваш доктайп и произошла та же чушь =( почему то все изчезло и осталась только обводка тех двух блоков внутри контента =(

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

html, body{
  height: 100%;
}

то вы увидите ваши блоки с не нулевой высотой.

yury, спасибо за совет) тогда еще вопрос. вот например именно этот случай. я вставляю файлик в страницу в котором у меня хранится определенный текст для контента и имя этой страницы. получается что мне лучше писать все нужные теги (<html> <head> <body>) или все таки хватит только самых необходимых? просто хочу оформить так чтоб в дальнейшем можно было с легкостью быстро добавлять новые файлы и не писать лишние теги

Необходимые тэги: доктайп-html-head-title-body:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
  <title></title>
</head>
<body>
</body>
</html>

#26 Kolovrat

Topic Starter

Заблокированные
61 сообщений

Репутация: 0

Отправлено 12 Апрель 2012 - 22:27

спасибо все понятно)
только вот на счет body

я создал в стилях css элемент(не знаю как по другому назвать) body и применил его для тега body

<body id="body">

разве таким образом оно не применяется для всех блоков???

#27 yury

Пользователь
642 сообщений

Репутация: 188

Отправлено 12 Апрель 2012 - 22:41

стилевым свойством

#body{
margin: 0;
}

вы создали идентификатор body, который присвоили элементу body вашей страницы. Соответственно, свойства, описанные для этого идентификатора, вы применили лишь к этому элементу.
Есть еще правила наследования свойств дочерних блоков от блоков-родителей, но их значения по умолчанию неоднозначны (что-то наследуется, а что-то нет) и могут различаться для разных браузеров и стандартов верстки. Проще на них не полагаться, а прописывать необходимые свойства явно.

#28 Kolovrat

Topic Starter

Заблокированные
61 сообщений

Репутация: 0

Отправлено 12 Апрель 2012 - 22:59

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

robot

Пользователь PRO
2 652 сообщений

Репутация: 85

Обратно в Javascript и языки разметки

Зарегистрируйтесь для ответа в тему

Сайт отображается в разных браузерах по-разному

#21 yury

#22 Kolovrat

#23 yury

#24 Kolovrat

#25 yury

#26 Kolovrat

#27 yury

#28 Kolovrat

robot

Войти