Еще один способ использования свойства zoom

Категория: (css, html, Статьи) автор: Александр Бойченко дата: 10-12-2011

В 99.9% случаев CSS свойство zoom используется верстальщиками для активации hasLayout в IE. Я хочу рассказать о том 0.01% проценте использования этого свойства.
В те времена, когда трава была зеленее, миром правил IE, а дизайнеры учились рисовать сайты- приходилось часто сталкиваться с неоднозначными дизайнерскими решениями.
Одним из этих решений — кастомные скроллбары, например такие:
маленький скролл
Читать далее »

Не все теги одинаково полезны

Категория: (css, html, Статьи) автор: Александр Бойченко дата: 16-05-2010

Решил померять как быстро отрисовываются теги без применения к ним каких-либо стилей.

Суть теста — генерируем 10к тегов на одной странице и меряем reflow.

Результаты оказались очень любопытные.

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

Тег Safari 4.0.5 (mac) FF 3.6.3 (mac) Opera 10.53 (mac) iPad
div 173 270 218 710
span 52 608 113 294
p 173 287 235 711
b 50 607 116 299
i 50 600 1164 297

Очень странные результаты показал IE — почти нулевые рефлоу (поэтому пока не заполняю таблицу с результатами IE*)

Вывод:

  • в Opera и Safari inline элементы в 2 раза быстрее блочных
  • в FF все наоборот, блочные быстрее инлайновых в 2 раза
  • существую теги, которые серьезно влияют на рефлоу (например i в Опере и FF )

Скоро проведу более детальное исследование + проверим скорость основных css свойств.

upd. имена тегов в таблице ведут на соответствующие тесты

CSScomb в WebStorm — Сортировка CSS свойств

Категория: (css, html, WebIDE) автор: Александр Бойченко дата: 05-04-2010

Есть хороший проект называется CSScomb от Вячеслава Олиянчука aka miripiruni. Суть его в том, что он сортирует CSS свойста согласно определенному порядку, который мы выставляем самостоятельно. Уже есть плагины для Coda и TextMate. Однако я пользуюсь WebStorm (WebIde) и очень захотелось подобного функционала именно в нем. Ну что ж сказано — сделано :)
Читать далее »