Несколько классов у тэга?

JIucky · December 23, 2010

По субжу, можно ли IE6 обучить такой магией?

p/s: у меня шо то не хотит понимать!

psywalker · December 23, 2010

По субжу, можно ли IE6 обучить такой магией?
p/s: у меня шо то не хотит понимать!

Да, у ИЕ6 есть такая особенность. А покажи пример, что именно не пашет. Пример на отдельной странице.

Вот например такой вариант пашет а ИЕ6

<!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>Документ без названия</title>
<style type="text/css">
	.a { color: red;}
	.b.a { color: blue;}
</style>
</head>

<body>
	<h1 class="b a">Заголовок</h1>
	<h1 class="a b">Заголовок</h1>
</body>
</html>

Ие6 руководствуется последним классом, если например ты напишешь так, то уже обломаешься

<!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>Документ без названия</title>
<style type="text/css">
	.a { color: red;}
	.b.a { color: blue;}
</style>
</head>

<body>
	<h1 class="a">Заголовок</h1>
	<h1 class="a b">Заголовок</h1>
</body>
</html>

Т.е. класс .а отдельно уже просто будет игнорить красный цвет.

JIucky · December 23, 2010

У меня ситуация такая:

<div class="rb">тута текст какой-то!</div>
<div class="rb none">тута снова текст какой-то!</div>

<style>
.rb{
width:200px;
float:left;
margin:0 15px 20px 0;
background:url(../images/border.gif) repeat-x bottom;
}

.rb.none{
margin:0 0 20px 0;
}
</style>

И вот <div class="rb none"> не отображает фон почему-то! Я попробовал сделать так:

.rb.none{
margin:0 0 20px 0;
background:url(../images/border.gif) repeat-x bottom;
}

Но чо то не помогло.

psywalker · December 23, 2010

У меня всё пашет

<!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>Документ без названия</title>
<style type="text/css">
.rb{
width:200px;
float:left;
margin:0 15px 20px 0;
background: red;
}

.rb.none{
margin:0 0 20px 0;
background: blue;
}
</style>
</head>

<body>
<div class="rb">тута текст какой-то!</div>
<div class="rb none">тута снова текст какой-то!</div>
</body>
</html>

Aurica · December 23, 2010

я попробовала с фоновой картинкой проверить, так вот дело в пути. Если путь обозначить

background:url(images/sq1.jpg) repeat-x bottom;

то все работает, как только добавляется "../" в начале, IE6 перестает понимать путь. Из-за чего - не знаю. Переноси картинки в другую директорию, чтоб без "../" обращаться.

Edited December 23, 2010 by Aurica

ankoch · December 24, 2010

я попробовала с фоновой картинкой проверить, так вот дело в пути. Если путь обозначить
background:url(images/sq1.jpg) repeat-x bottom;
то все работает, как только добавляется "../" в начале, IE6 перестает понимать путь. Из-за чего - не знаю. Переноси картинки в другую директорию, чтоб без "../" обращаться.

Это потому что картинка у вас лежит в папки "images" относительно корня сайта и корректный адрес к ней именно такой "images/sq1.jpg", а если добавить к адресу "../", то браузер будет искать её относительно таблицы стилей.

JIucky · December 24, 2010

У меня всё пашет

А у меня где-то пашет такая конструкция, а где-то нет! Сейчас юзаю multipleIE, задрал тестер со своими ошибками.

я попробовала с фоновой картинкой проверить, так вот дело в пути.

Танцы с бубном в полнолуние тоже помогают!)

Vlad · December 24, 2010

В IE6 вроде как имеются проблемы с множественными классами. Вычитал, что применяется только последний класс в цепочке a.b.c, остальные игнорируются. Но мне никак не удалось получить эту ошибку на практике. То ли она проявляется при некоторых условиях, то ли IETester врет.

Great Rash · December 24, 2010

А чо бы не поставить пробел между именами классов?

.rb .none {
margin:0 0 20px 0;
}

Aurica · December 24, 2010

Это потому что картинка у вас лежит в папки "images" относительно корня сайта и корректный адрес к ней именно такой "images/sq1.jpg", а если добавить к адресу "../", то браузер будет искать её относительно таблицы стилей.

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

Я видела такие варианты, когда люди некоторые картинки убирали с корня сайта (или с любой другой папки внутри сайта) на уровень выше (самого корня сайта), хотя не понимаю зачем. К сожалению, тогда не проверяла работает ли в IE6.

images/
корень сайта/
  images/
  1.html  (стили определены в самом файле).

images/
корень сайта/
  css/
  images/
  1.html

images/
корень сайта/
  images/
  test/
	css/
	1.html

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

Автор ведь не уточнял где его картинка лежит.

Если у кого-то по-другому - напишите.

Edited December 24, 2010 by Aurica

psywalker · December 24, 2010

В IE6 вроде как имеются проблемы с множественными классами. Вычитал, что применяется только последний класс в цепочке a.b.c, остальные игнорируются. Но мне никак не удалось получить эту ошибку на практике. То ли она проявляется при некоторых условиях, то ли IETester врет.

Как это не удаётся, я же выше привёл решения с ошибкой и без.

А чо бы не поставить пробел между именами классов?
.rb .none {
margin:0 0 20px 0;
}

А нахрена? Ведь это же уже совсем другая песня?

Vlad · December 24, 2010

Пардон, невнимательно прочитал пост.

deadrash · December 24, 2010

Попробуй в .rb .none использовать не картинку а просто цвет блоку поменять, если меняется значит проблема именно в картинке, или в путях к ней.

Рекомендую все внутренние ссылки всегда прописывать от корня сайта т.е. с / вот таким образом - background:url(/images/border.gif) repeat-x bottom;

Тогда не будет путаницы с путями.

Great Rash · December 24, 2010

А нахрена? Ведь это же уже совсем другая песня?

Да нет, все та же.

UPD: а не, пардон, ошибся.

UPD2: а почему не задать классы на разных строках?

div .rb{
width:200px;
float:left;
margin:0 15px 20px 0;
background: red;
}

div .none{
margin:0 0 20px 0;
background: blue;
}

mishka · December 24, 2010

Да, у ИЕ6 есть такая особенность. А покажи пример, что именно не пашет. Пример на отдельной странице.
Вот например такой вариант пашет а ИЕ6
<!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>Документ без названия</title>
<style type="text/css">
	.a { color: red;}
	.b.a { color: blue;}
</style>
</head>

<body>
	<h1 class="b a">Заголовок</h1>
	<h1 class="a b">Заголовок</h1>
</body>
</html>
Ие6 руководствуется последним классом, если например ты напишешь так, то уже обломаешься
<!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>Документ без названия</title>
<style type="text/css">
	.a { color: red;}
	.b.a { color: blue;}
</style>
</head>

<body>
	<h1 class="a">Заголовок</h1>
	<h1 class="a b">Заголовок</h1>
</body>
</html>
Т.е. класс .а отдельно уже просто будет игнорить красный цвет.

Такой совет напутствие: если поддерживаете ие6, то .b.a { color: blue;} так вот лучше не писать вообще! напишите .a { color: blue;}

Так как ие6 реагирует только на последний класс.

А такая форма записи (.a { color: blue;}) сразу гарантирует что ие6 будет принимать стили так же как и все браузеры.

JIucky · December 28, 2010

Разобрался в чем дело было! У меня были один и тот же класс (.none) у нескольких блоков, хотя стили я задавал уникальные, т.е. у каждого .none был родитель:

<div class="rb none">...</div>
<div class="class2 none">...</div>
<div class="class3 none">...</div>
....
<style type="text/css">
.rb{
стили
}
.rb.none{
стили
}
.сlass2.none{
снова стили
}
.сlass3.none{
и опять стили и еще background:none;
}

Но ИЕ6 почему-то понимал .none как общий стиль, как у меня и получилось, шо к .rb.none применялись стили от .сlass3.none!

UPD2: а почему не задать классы на разных строках?

Можно и так, разницы нет!

Sign In

Несколько классов у тэга?

Question

Link to comment

Share on other sites

15 answers to this question

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Обсуждения

Important Information