Сложный background средствами чистого CSS

Question

[Илья Ковалевский]

Привет, хабр!

Заранее прошу прощения за такой идиотский вопрос, но блин.

Есть два варианта:
1) Есть паттерн специфической формы и размера (20x16). Им надо заполнить блок таким образом, чтобы он заполнял его со смещением 1px. Чтобы не циклевался (повторялся), а именно заполнялся. Чтобы каждый новый элемент паттерна начинался на 1px правее начала предидущего элемента.

2) Есть три картинки. Первая описывает левую часть бэкграунда, вторая паттерн (x) для центра, и третяя — для правой части. Нужно разместить их в одном блоке.

Все нужно сделать средствами CSS 2.1

Спасибо.

Comments

[Илья Ковалевский]

Возможны варианты с CSS3

Answer 1

[Сергей Жужгов]

Попробуй так:
background:
url(../..) 0 0 no-repeat,
url(../..) -123px 100% no-repeat,
url(../..) -456px 0 repeat-y;

Answer 2

[demimurych]

и 1 и 2 в css2.1 без дополнительных блоков невозможно.

Comments

[Илья Ковалевский]

А средствами :after, :before? Или хотя бы с CSS3 покажите

[demimurych]

habrahabr.ru/post/117160/