Ищу лучшую технику полукруглых углов на CSS

[General Fizz]

Десятки вариантов закругленных уголков:

Для просмотра скрытого содержимого вы должны войти или зарегистрироваться.

 

[anon99]

На сегодняшний момент самый универсальный и надёжный способ (с минимальный кол-вом кода) сделать бордюры с загнутыми углами:

Таблица (border=0), центр это ваш контент, по четырём сторонам будет background-image (ваш бордюр без углов), а по четырём угловым колонкам будет background-image (плавные углы).
Размер колонок (за исключением средней с контентом) должен быть фиксированным.

 

[whitewolff]

без ява-скрипта пожалуй 3 варианта:
- таблицей 3х3
- вариант с кучей тегов по уголкам, приводился несколькими постами выше
- вложеными один в другой 8 дивов - но катит только в случае если уголки без прозрачности.

<style type="text/css">
.frame-01{background: #FFFFFF url('frame-left.jpg') repeat-y;}
.frame-02{background: url('frame-right.jpg') repeat-y right;}
.frame-03{background: url('frame-top.jpg') repeat-x;}
.frame-04{background: url('frame-bottom.jpg') repeat-x bottom;}
.frame-05{background: #FFFFFF url('frame-left-top.jpg') no-repeat left top;}
.frame-06{background: #FFFFFF url('frame-left-bottom.jpg') no-repeat left bottom;}
.frame-07{background: #FFFFFF url('frame-right-top.jpg') no-repeat right top;}
.frame-08{background: #FFFFFF url('frame-right-bottom.jpg') no-repeat right bottom;}
</style>

<div class="frame-01"><div class="frame-02">
<div class="frame-03"><div class="frame-04">
<div class="frame-05"><div class="frame-06">
<div class="frame-07"><div class="frame-08">
контент
</div></div></div></div>
</div></div></div></div>

 

[biblio_nist]

Глюков не замечал ни в одном браузере.
html:
<b class="n1"></b><b class="n2"></b><b class="n3"></b><b class="n4"></b>
<div class="contentn">
Ваш текст
</div>
<b class="n4"></b><b class="n3"></b><b class="n2"></b><b class="n1"></b>

css:
.n1, .n2, .n3, .n4{font-size:1px; overflow:hidden; display:block;}
.n1 {height:1px; margin:0 5px;}
.n2 {height:1px; border-right:2px solid #666; border-left:2px solid #666; margin:0 3px;}
.n3 {height:1px; border-right:1px solid #666; border-left:1px solid #666; margin:0 2px;}
.n4 {height:2px; border-right:1px solid #666; border-left:1px solid #666; margin:0 1px;}
.contentn {border-right:1px solid #666; border-left:1px solid #666;}

 

[ruberentis]

Для просмотра ссылки Войди или Зарегистрируйся

Углы без сглаживания, не очень красиво.

 

[neanton]

такую проще всего делать таблицей, не запаривайся, главное кроссбраузерность поддерживать

 

[skoz]

Вот тут описываются все валидные способы с минимальным кодом и максимальной поддержкой. Все по полочкам разложили %)

Для просмотра ссылки Войди или Зарегистрируйся

 

[katrukhin]

jQuery - в помощь, если прогуглить можно скриптец найти, который без усилий тебе округлые углы будет лепить на все что ты обозначишь своим заветным классом.

Такой как раз на днях видел.

 

[eshkin]

линк на jquery, сам только начинаю применять
таблицы надоели, а дивы на дух не переношу)

Для просмотра скрытого содержимого вы должны войти или зарегистрироваться.