CSS Hack от Trifler Blog Hack CSS for IE8 Vertical Text

Trifler Blog

CSS Hack от Trifler Blog

В большинстве случаев использование хаков в таблице стилей вынужденная мера и без них по большому счету не обойтись.

Собственно говоря, браузеры можно разделить на две группы:

  • OPERA, IE6 (7, 8)
  • FF, Google Chrome, Safari

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

В тоже время они ведут себя вполне предсказуемо, чего не скажешь об OPERA и семействе IE.

При просмотре наиболее часто употребляемыех мной css хаков, как-то само собой нарисовалась такая табличка.

Совместный хак для OPERA и IE8, может быть полезен, к тому же он короче, чем индивидуальный хак для OPERA, в случае необходимости, для IE8, используем персональный хак.

Hack CSS for IE8

С появлением IE8 практически отпала необходимость в индивидуальных стилевых правилах для очередного детища Microsoft, но так уж повелось, рано или поздно наступает момент, когда приходится, каким либо способом отделять разные версии браузеров - одну от другой.

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

В частности FireFox 3.5 понимает данную конструкцию:

.class {color /*\**/: #00f\9;}

Пришлось самому взяться за это не благодарное дело.

Удивительное рядом - мастер Горди в роли хакер, вот и представить себе не мог, что докачусь до такого :)

Хотелось получить легко запоминающуюся вещицу на подобие звездного хака для IE6 - *html.

Но тут вышла полная ерунда ;=(

В конце концов, задача была решена следующим образом:

.class {color:#00f\0/;}

Пример вам все покажет, краткие пояснения там присутствуют.

Vertical Text

Самым простым, эффективным и надежным решением по созданию вертикально расположенного текса, является графика.

В первую очередь не последнюю роль играет качество текста и минимальные погрешности его визуального представления в различных браузерах.

Но...

Если наш текст будет на любой подложке (прозрачная, градиент или однотонная заливка), то при отключенной графике, линк на доступ к спрятанной закладке отданный, как background:url(…), а это подразумевалось при создании данной конструкции, отсутствует.

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

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

Плюс/минус время.

Тут и пригодится возможность только средствами html и css добиться нужного результата.

Способ не универсальный.

Проблемы разночтений в зоопарке браузеров достаточно велики и очевидны, но иногда...

Без пояснений, что, как и зачем.

Смотрим, забираем, пользуемся.

Прыг: 05 06 07 08 09 10 11 12 13 14 15
Скок: 10 20 30

banner counters.php

leftcounters
width:160px;
height:160px;

banner counters.php

centercounters
width:160px;
height:160px;

banner counters.php

rightcounters
width:160px;
height:160px;

Горизонтальный banner counters.php - width:494px;

февраль, 2012
пн вт ср чт пт сб вс
    1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29        
free  counters