Произвольные границы блоков. CSS.
 

Всем привет! Решил попробовать сверстать какой-нибудь простенький шаблон и возникла проблема - надо сделать у блока границы картинками. Пошарив в интернете я понял что решений у этой проблемы 1001, но либо решение жутко неудобное, либо не кроссбраузерное, либо надо к одному div еще 10 сделать и т.д. Нашел несколько очень простых способов:

1. Multiple backgrounds. Всем хорош. Не нужен javascript. Мало css. Мало html. Но не пашет в ие7. Demo
2. CSS3. Тоже самое только тут используем border-image. Demo
3. jQuery (псевдоCSS3). Все бы хорошо, даже поддерживается ie7, но лично у меня его так и не получилось заставить работать.Demo

Может я пропустил какой-нибудь очень очень простой способ, который будет кроссбраузерным (если не будет работать на ие6 то и хрен с ним)? Поделитесь способами.

Ответ: Произвольные границы блоков. CSS.
 

Боюсь, что ты нашел самые простые решения) В любом случае тут три общих решения:

1. Используем css3:
Не работает в старых браузерах, работает не во всех новых браузерах. В ИЕ не будет работать до 9-й версии. На мой взгляд пока этот способ можно использовать как дополнение ко одному из ниже перечисленных

2. Используем js (canvas-метод).
- Не работает с выключенным js. (хотя я тяжело представляю серфинг с выключенным js в веб 2.0 интернете, но параноики встречаются). Вполне приемлемый вариант, но подсказать к сожалению ничего не могу, т.к. не никогда не прибегал к этому способу

3. Используем кучу вложенных дивов
- Мне как человеку старой закалки больше всего привычен этот способ. Когда интернет был медленный, компьютеры большие, а css3 даже не снился верстальщикам - этот способ был единственным решением
Плюсы очевидны, такой способ будет работать даже в ие6 :) Да и страшного, на мой взгляд, ничего нет. Для создания нужно всего 5-ть вложенных дивов (для создания 4 кастом-бордеров, для меньшего числа будет число_кастом_бордеров+1 дивов).

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

Ответ: Произвольные границы блоков. CSS.
 

+1 Так же делал, мир не перевернулся.