HTML+CSS+JavaScript

помогите, пожалуйста, сделать с помощью div'oв рамку как на рисунке: серая, чтобы углы были скруглены. как сделать прямоугольник с закругленными углами, нашла, а рамку никак не могу. заранее спасибо

почитайте http://softtime.ru/forum/read.php?id_forum=4&id_theme=9998&page=1

закругленные углы нудно рисоать:

например:

вся рамка шириной 150px. режите ее по горизонтали на 3 части - закругления сверху ( например 20px высотой),
закругления снизу( например20px высотой), часть из середины( например10px высотой).

стили CSS

<style>
#all{width:150px}

#top{background: url(top.gif) no-repeat top left; height:20px;}

#center{background: url(center.gif) repeat-y top left;}

#bottom{background: url(bottom.gif) no-repeat top left; height:20px;}

</style>

в HTML

<div id="all">
<div id="top"></div>
<div id="all">
здесь помещается текст
</div>
<div id="bottom"></div>
</div>

То что на картинке, это называется FIELDSET.
Все гораздо проще чем кажется.

<fieldset>    <legend><h3>картинка или заголовок помещается сюда</legend>    А здесь содержимое... </fieldset>

расскажите поподробнее о FIELDSET, какие имеются у него параметры?

fieldset с закругленными углами - только в IE от 6-й версии. но если ему добавить стиль и изменить,
например, цвет границы, он моментально становится с прямыми углами. параметров у него нет,
но можно добалять стили границы - цвет, толщину и стиль.

спасибо.

что в IE от 6-й версии объясняет, почему я раньше с ним не встречался.

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

вот тут я экспериментировала с fieldset'oM:
http://www.nexus.gr/

2 codexomega: действительно просто и удобно, только у меня в IE6.0 и Opera 9.0 уголки не закругленные :(. FireFox <fieldset> вообще не поддерживает.
задание получается, только уголки не скругленные. не пойму, почему. Может быть кто-то знает, в чем может быть дело?

может быть вам поможет тема про круглые рамки без рисунков http://www.softtime.ru/forum/read.php?id_forum=4&id_theme=9495&page=5

такой код я как раз использовала, чтобы оливковый прямоугольник нарисовать, спасибо, оно действительно помогло, только теперь мне надо разобраться, как рамку с закругленными углами сделать и с оливковым прямоугольником ее совместить. уфф

Этот код в css весьма хитрый, поэтому сколько ни есть примеров по сети - все повторяют 1 и тот же шаблон, других не найдёте. Смысл в том, чтобы попиксельно вырисовать круглую границу. В случае тонкой рамки метод не пройдёт, надо новый выдумывать (хотя можно подложить один слой под другой). Чтобы такое сотворить, надо очень хорошо понимать, что происходит со слоями. Даже чуть утолщить радиус закругления - это требует нового кода.

ребята, кое что получилось. результат в прикрепленном файле. как теперь сделать, чтобы оливковый прямоугольник тоже съезжался и разъезжался в зависимости от количества текста в нем?
и может еще кто-то подскажет, что-то IE6.0 и Opera 9.0 уголки не закругляет. может я что-то не так поняла?

from elenaki:
>fieldset с закругленными углами - только в IE от 6-й версии.
>но если ему добавить стиль и изменить,
>например, цвет границы, он моментально становится с прямыми углами.
>параметров у него нет,
>но можно добалять стили границы - цвет, толщину и стиль.

http://www.libray.narod.ru/html/content/pr_215.html

>>как теперь сделать, чтобы оливковый прямоугольник тоже съезжался и разъезжался в зависимости от количества текста в нем

ширину задайте

это не выход. он и будет той ширины, которую зададут, а не той, которая реально у строки в legend.