Скруглить углы на css

Тема: Скруглить углы на css

цитата
12/02/09 в 17:12

densa
Нужно при помощи цсс скруглить углы блоков.
Сам я сколько не пыжился не смог это сделать.
Кто готов помочь за $ стучите (ася в профайле)

цитата
12/02/09 в 17:19

FiN
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<title>Untitled</title>
</head>

<body>
<style>
.r1, .r2, .r3 {
overflow: hidden;
font-size:1px;
}
.r3 { margin: 0 3px; }
.r2 { margin: 0 2px; }
.r1 { margin: 0 1px; }
#rounded-box-3 .inner-box, #rounded-box-3 b {
background-color: #CCCCCC;
}

.inner-box {
padding:1em;
}
.r1, .r2, .r3 {
display: block;
height: 1px;
}
</style>
<table>
<td>
<div id="rounded-box-3">
<b class="r3"></b><b class="r1"></b><b class="r1"></b>
<div class="inner-box">
файл
</div>
<b class="r1"></b><b class="r1"></b><b class="r3"></b>
</div>
</td>

<td>
<div id="rounded-box-3">
<b class="r3"></b><b class="r1"></b><b class="r1"></b>
<div class="inner-box">
дата 1
</div>
<b class="r1"></b><b class="r1"></b><b class="r3"></b>
</div>
</td>

</table>

</body>
</html>

цитата
12/02/09 в 17:25

densa
стукни плз 341125866

цитата
12/02/09 в 17:39

pinnokio
кодом или графикой?

Если кодом, увы, ИЕ6 поддерживать не будет
Отлично работает только в ФФ.

цитата
12/02/09 в 17:51

densa
можно графикой, мне без разницы, главное что бы у дива углы круглые были

цитата
12/02/09 в 18:27

Foxy Babe
Код:

.spiffy{display:block}
.spiffy *{
display:block;
height:1px;
overflow:hidden;
font-size:.01em;
background:#fff}
.spiffy1{
margin-left:3px;
margin-right:3px;
padding-left:1px;
padding-right:1px;
border-left:1px solid #6d908d;
border-right:1px solid #6d908d;
background:#bf483e}
.spiffy2{
margin-left:1px;
margin-right:1px;
padding-right:1px;
padding-left:1px;
border-left:1px solid #19dcdf;
border-right:1px solid #19dcdf;
background:#ce3a2f}
.spiffy3{
margin-left:1px;
margin-right:1px;
border-left:1px solid #ce3a2f;
border-right:1px solid #ce3a2f;}
.spiffy4{
border-left:1px solid #6d908d;
border-right:1px solid #6d908d}
.spiffy5{
border-left:1px solid #bf483e;
border-right:1px solid #bf483e}
.spiffyfg{
background:#fff}

цитата
12/02/09 в 18:32

densa
Народ мне нужно что бы мне сделали, не надо кодами кидаться
кто может сделать, стукните в асю, я скажу что сделать, вы сделаете и получите денежку.
Если бы мне нужен код я бы на яндекс пошел

цитата
12/02/09 в 19:16

Foxy Babe
densa: нам не нужна твоя денежка!

вот сходи сюда и сделай то что тебе нужно сам

http://www.spiffycorners.com/

цитата
12/02/09 в 20:23

raider
Оффтопик: Foxy Babe - шикарный ответ

цитата
12/02/09 в 20:39

pierx
pinnokio писал:

кодом, увы, ИЕ6 поддерживать не будет

Да поддерживает он

цитата
12/02/09 в 21:22

pinnokio
pierx писал:

Да поддерживает он

Конструкция типа Код:

-moz-border-radius

увы, приемлима только для ФФ. Тегов, для закругления углов, в ИЕ6 нет, это однозначно. Остается

3 основных метода: скриптами, подложка из рисунков, анти-семантический с попиксельным смещением кучи пустых блоков (имхо, самый извращенный).
Тема уже неоднократно обсосана и пережевана на хабре. К примеру, здесь:
_хttp://habrahabr.ru/blogs/webdev/32826/

Для желающих вот 38 различных способов.
_хttp://vremenno.net/html-css/38-articles-about-creating-rounded-corners/

Так о каком из способов речь?

цитата
13/02/09 в 00:52

pierx
http://www.cssplay.co.uk/boxes/krazy.html

Новая тема Ответить

Эта страница в полной версии