HTML+CSS+JavaScript

Пишу так:

.wrap {     white-space: pre-wrap; /* css-3 */     white-space: -moz-pre-wrap; /* Mozilla, начиная с 1999 года */     white-space: -pre-wrap; /* Opera 4-6 */     white-space: -o-pre-wrap; /* Opera 7 */     word-wrap: break-word; /* Internet Explorer 5.5+ */ }

Точнее - не работает в Firefox 3.6.8.

Инструкции (правила стилей) в CSS выполняются как приказы в армии.
Сиречь исполняется ПОСЛЕДНИЙ, а все предыдущие - отменяются.

Как полагаете - какой цвет будет у текста span'a, если он имеет следующие прописанные правила стиля?

<style> span { color: red; color: blue; color: green; color: black; } </style>

Правильно, цвет текста будет ЧЁРНЫЙ, ибо исполнится самый ПОСЛЕДНИЙ приказ - color: black;, а на все предыдущие (красный, голубой, зелёный) любой браузер "положит с прибором".

И совершенно НИЧЕГО НЕ ИЗМЕНИТСЯ, если Вы эту конструкцию снабдите Вашими комментариями:

<style> span { color: red;   /*Для MSIE*/ color: blue;  /*Для Opera*/ color: green; /*Для FireFox*/ color: black; /*Для Chrome*/ }

Цвет текста span'a в ЛЮБОМ из браузеров так и будет ЧЁРНЫМ.


Соответственно, из 4-х прописанных Вами инструкций для white-spase работать будет только одна - ПОСЛЕДНЯЯ, та, которая у Вас предназначается для Opera 7. Прочие браузеры (в том числе и FireFox) воспримут установленное значение как Вашу ОШИБКУ.
А при ошибочном значении правила стиля все браузеры проставляют значение ПО УМОЛЧАНИЮ.
В чём Вы тоже можете удостовериться, прописав, например, следующее:

<style> span { color: красный; } </style>

Браузеры не понимают кириллических символов в значениях и потому установят дефолтный цвет - тот самый ЧЁРНЫЙ.

Ферштейн?

Тогда ответьте на вопрос ещё один. Какой из вариантов подойдёт современной Опере? Выше 7-ки.

Изучайте - https://developer.mozilla.org/en/CSS/white-space

Спасибо. Классная там таблица. Я уже ППЦ как намучался.

НАМУЧАЛСЯ!
ВСЕ РАВНО НЕ РАБОТАЕТ (ТОЛЬКО В ОПЕРА 10.60)!

ВОТ КОД:

<style type="text/css"> .wrap { word-wrap: break-word } </style> <!--[if (gte IE 5.5)&(lt IE 8.0)]> <style type="text/css"> .wrap { word-wrap: break-word } </style> <![endif]--> <!--[if IE 8.0]> <style type="text/css"> .wrap { word-wrap: break-word; white-space: pre-wrap } </style> <![endif]--> <!--[if (gte Gecko 1.0)&(lte Gecko 2.0)]> <style type="text/css"> .wrap { word-wrap: break-word; white-space: -moz-pre-wrap } </style> <![endif]--> <!--[if Gecko 3.5]> <style type="text/css"> .wrap { word-wrap: break-word; white-space: pre-wrap } </style> <![endif]--> <!--[if (Opera gte 4.0)&&(lte Opera 6.0)]> <style type="text/css"> .wrap { word-wrap: break-word; white-space: -pre-wrap } </style> <![endif]--> <!--[if Opera 7.0]> <style type="text/css"> .wrap { word-wrap: break-word; white-space: -o-pre-wrap } </style> <![endif]--> <!--[if Opera 8.0]> <style type="text/css"> .wrap { word-wrap: break-word; white-space: pre-wrap } </style> <![endif]--> <!--[if Opera 9.5]> <style type="text/css"> .wrap { word-wrap: break-word; white-space: pre-wrap } </style> <![endif]--> <!--[if WebKit 3.0]> <style type="text/css"> .wrap { word-wrap: break-word; white-space: pre-wrap } </style> <![endif]-->

Рассмешили :-))

Условные комментарии (Conditional Comments) работают ТОЛЬКО В БРАУЗЕРЕ MSIE
Соответственно, Ваши конструкции

<!--[if (gte Gecko 1.0)&(lte Gecko 2.0)]> <!--[if Gecko 3.5]> <!--[if (Opera gte 4.0)&&(lte Opera 6.0)]> <!--[if Opera 7.0]> <!--[if Opera 8.0]> <!--[if Opera 9.5]> <!--[if WebKit 3.0]>

не понимает вообще НИ ОДИН браузер, в том числе и MSIE.

Ибо

<!--[if ВОТ ЗДЕСЬ ДОЛЖНО БЫТЬ ТОЛЬКО ПРО IE]>...<![endif]-->

Для того, чтобы задать стиль ТОЛЬКО для браузера OPERA, или ТОЛЬКО для браузера FireFox, или ТОЛЬКО для браузера WebKit существуют свои специальные способы.

Вот Вам пример. Вместо выделенного жирным впишите нужные Вам класс {свойство: значение} для каждого из браузеров:

<style> * {font-weight: bold; font-size: large} /*Для Google Chrome и Apple Safari*/ @media screen and (-webkit-min-device-pixel-ratio:0) {div {color: red}} /*Для Mozilla FireFox*/ @-moz-document url-prefix() {div {color: green}} /*Для Opera*/ @media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) {head~body div {color: silver}} </style> <!-- Для MSIE--> <!--[if IE]> <style> div {color: aqua} </style> <![endif]--> <div>MSIE - голубой<br> FireFox - зеленый<br> Chrome и Safari - красный<br> OPERA - серый  </div>

Только для IE надо заново <style></style> писать? Просто странно для других написано - { значение }

Прикол в том, что пусть я и неправильно указал на другие браузеры, но не работает именно в IE wrap! IE 8.

Да нет никакого прикола.
Я Вам уже указывал - если Вы напишете ОШИБОЧНО, то браузер Вашу ошибку не просто проигнорирует, а установит стиль по умолчанию.

А ошибок у Вас - пруд пруди.
И не только упоминание всяких-разных браузеров, но и просто в синтаксисе условий.
Например, писать надо просто if IE 8, а не if IE 8.0
Логическое "И" в Conditional Comments состоит из одного амперсанда, а не из двух.
И т.д. и т.п.

Изучите http://msdn.microsoft.com/en-us/library/ms537512.aspx

для оперы отдельные стили так:

<link rel="stylesheet" href="/css/opera.css" media="all" type="text/opera"/>

Спасибо за информацию - ново.