Перед вами рамочка, которая имеет два слоя, причем оба слоя с закруглениями. Радиус закругления в обоих случаях у меня 30px. Можно радиус закругления изменить, заменив 30 другим числом, а можно поставить нулевое значение для каждого слоя, и рамочка будет без закруглений. А вот если внешний слой сделать с закруглением, а внутренний без закругления, то получится очень интересная рамочка. Каждый слой содержит 4 тега: table, tbody, tr, td. Ширина нижнего слоя 700px, на этот слой накладывается другой, но в теге td нижнего слоя заложен отступ от края в 3px, поэтому ширину слоя, на котором будет текст, я указала числом 694. Возьмете больше, рамочка автоматически растянется в ширину, возьмете меньше, справа будет виден кусок нижнего слоя. Есть 4 разделителя, их ширина не может быть больше 694 ( даже меньше из-за стандартного отступа, про который я давно задавала вопрос, но ответа не получила). При бОльших значениях рамочка будет автоматически растягиваться в ширину, при меньших все будет нормально. Разделители можно убрать или заменить другими. По мере заполнения рамочки текстом она автоматически будет растягиваться в длину, как чулок. Рамочку можно сделать шириной 800px или 850px, но тогда 694 придется увеличить на 100 или 150. Вполне возможно, что при наличии только border-radius: 30px не все браузеры выполнят закругление, поэтому для каждого слоя надо указывать еще дополнительно -moz-border-radius: 30px; -webkit-border-radius: 30px; -khtml-border-radius: 30px;. Последнее дополнение встречается редко. Текст будет иметь отступ от края не менее чем на 20px. Вроде, сделала все пояснения для изготовления желающими собственной рамочки. |
|