[CSS] obustronna dekoracja nagłówka strony, działa dobrze tylko dla jednoliniowych nagłówków Opcje

[hiszpanespaniol]

Witam wszystkich.

Chcę uzyskać nagłówek strony z wyśrodkowanym tekstem oraz dekoracją po lewej i po prawej stronie. Poniżej mój kod, który sprawdza się dla nagłówków z tekstem mieszczącym się w jednej linijce (czyli kropki po lewej i prawej, odsunięte o 10px od tekstu):

[HTML] pobierz, plaintext 
<style type="text/css">
h1 {text-align: center}
h1 span {
background: url(kropka.gif) left top no-repeat;
padding: 0 0 0 10px;
}
h1 span span {
background-position: right top;
padding: 0 10px 0 0;
}
</style>
 
<h1>
<span><span>Lorem Ipsum</span></span>
</h1>
[HTML] pobierz, plaintext 

Problem pojawia się przy nagłówkach których treść nie mieści się w jednej linijce. Kropka prawa przechodzi niżej. Potrzebuję rozwiązania działającego dla dowolnej ilości tekstu. Znaczniki można zmienić, ale zachowując semantyczność. Nie wchodzą w grę img, czy table.