[HTML][CSS] Zaokrąglenie rogów, a procentowe rozciągnięcie obiektów <div> Opcje

[WebCM]

Niektóre elementy <div> (np. kontener na newsy, menu) mają zaokrąglone rogi. Popatrzmy na przykład:

[HTML] pobierz, plaintext 
<div class="naglowek">
  <span class="lewy_naroznik"></span>
  Jakiś tam tytuł
  <span class="prawy_naroznik"></span>
</div>
 
<div class="wlasciwa_czesc_divu">
  <p>Jakiś tam bardzo długi tekst - news, artykuł lub cokolwiek</p>
</div>
 
<div class="zakonczenie_boksu"></div>
[HTML] pobierz, plaintext 

W powyższym przykładzie nagłówek składa się z 3 części: lewego narożnika, środka i prawego narożnika. Takie rozwiązanie pozwala na zastosowanie długości procentowej - można dowolnie rozciągnąć nagłówek. Niestety, kod HTML zajmuje więcej miejsca i nie jest uniwersalny.

Popatrzmy jeszcze na stopkę - zakończenie boksu. W przykładzie może ona mieć tylko stałą szerokość. Ustalenie procentowej zawartości spowoduje deformację, bo 1 plik graficzny zawiera już narożniki.

Poszukuję takiego rozwiązania, aby dało się dowolnie rozszerzać nagłówek i stopkę, ale nie wymagało to nadmiaru kodu. Najlepiej, by wystarczył jeden wpis:

[HTML] pobierz, plaintext 
<div class="naglowek_zaokraglony">Tytuł</div>
[HTML] pobierz, plaintext 

Jest to w ogóle możliwe? CSS 3 raczej odpada, bo nie wszystkie przeglądarki wspierają.

Co jest lepsze dla użytkownika?

1) Szerokość dostosowana do szerokości przeglądarki
2) Stała szerokość - ale trzeba wybrać 1024x768 albo wyższą

Ten post edytował WebCM 9.08.2010, 20:00:56

[kilas88]

http://css3pie.com/
WebCM, powyższa biblioteka powinna Cię zainteresować :-) Masz tam border-radius z CSS3 + hack dla IE6-IE8. Nic dodać nic ująć, moim zdaniem. Choć ja i tak nie dodawałbym wcale obsługi zaokrągleń do IE, niech cierpią (IMG:style_emoticons/default/biggrin.gif)