Pull to refresh

Полупрозрачный блок со скругленными углами

Reading time1 min
Views2.7K
Хочу представить на суд общественности свой вариант реализации полупрозрачного блока со скругленными углами. Кроссбраузерно, полностью резиново. На все про все 3 div'а. Интригует?

Для нетерпеливых сразу приведу ссылку с примером.
Год назад, если бы мне предложили сверстать такой блок, я бы отказался, заявив что в Internet Explorer 6-й версии его реализовать не получилось бы ну никак. Возможно, я бы изголился и сверстал бы такой блок, но для этого мне бы понадобилось минимум 9 div'ов. Некоторое время назад, получив волшебный пендель от DelkaDelka и прочитав очень полезную статью, я нашел довольно простое кроссбраузерное решение.

Минусы, как всегда, имеются. Не получилось собрать все имеющиеся картинки уголков и рамок в один спрайт. Для IE6 нужны все 8 картинок. Для нормальных браузеров хватит 6. Для IE7 можно собрать все картинки в одну :) Громоздкие файлы стилей для IE6-7 воспринимаем как неизбежность…

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

Тестировалось в FF3, NN9, IE6-7, Opera 9.2-9.5 и Safari (все Win).
Tags:
Hubs:
Total votes 30: ↑17 and ↓13+4
Comments48

Articles