Помогите сделать элемент на css!

[Self Author]

Вот стоит передо мной такая задача: надо сделать заголовок h1, чтобы он выглядел так:



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

[Self Author]

Вот сам тут нарыл кое-что:

h1:before {
  display: marker;
  content: url(img/uzor_left.gif);
}
h1:after {
  display: marker;
  content: url(img/uzor_right.gif);
}

Но есть 2 проблемы:
1. IE наплевал на это и ничего не видит
2. Низ картинки выровнен по низу текста. А это некрасиво. И это самая противная проблема.

[<Descriptor>]

А если сделать div-ами? Те, что с картинкой - float по разным краям.
Или тебе нужно строго <h1>Заголовок</h1>?

[Self Author]

Дивами так не получается: надо чтобы картинки были на концах надписи, а не на сторонах страницы.
Я уже сделал таблицей. Выглядит - как надо, но очень грузно получается. Хотелось бы это как-то в стиль заголовка вписать раз и навсегда, чтобы каждый раз не повторять в html всю конструкцию.

[strocks]

картинка не грузится, если ещё надо, напиши - помогу