Форум АНТИЧАТ - Элемент с закругленными углами R=3px ((( а надо R=5px

Форум АНТИЧАТ (https://forum.antichat.xyz/index.php)

- PHP, PERL, MySQL, JavaScript (https://forum.antichat.xyz/forumdisplay.php?f=37)

Элемент с закругленными углами R=3px ((( а надо R=5px

PHP код:


		
			
<div id="rounded-box-3">

    <b class="r3"></b><b class="r1"></b><b class="r1"></b>

    <div class="inner-box">

        <h3>Элемент с закругленными углами R=3px</h3>

        <p>Этот способ закругления углов подсмотрен на GMail.</p>

    </div>

    <b class="r1"></b><b class="r1"></b><b class="r3"></b>

</div>

css

PHP код:


		
			


.r1, .r2, .r3 {

    display: block;

    height: 1px;

    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: #294d67;

}



.inner-box {

    padding:1em;

}

как увеличить радиус до 5 px?

Код HTML:

<style>.r1, .r2, .r3, .r4, .r5{

display: block;

overflow: hidden;

font-size:1px;

float: none;

}

.r5{

margin: 0 6px;

height: 1px;

background-color: #000;}

.r4{

margin: 0 4px;

height: 1px;

border-right: 2px solid #000;

border-left: 2px solid #000;

background-color: #CCCCCC;}

.r3{

margin: 0 3px;

height: 1px;

border-right: 1px solid #000;

border-left: 1px solid #000;

background-color: #CCCCCC;}

.r2{

margin: 0 2px;

height: 1px;

border-right: 1px solid #000;

border-left: 1px solid #000;

background-color: #CCCCCC;}

.r1{

margin: 0 1px;

height: 2px;

border-right: 1px solid #000;

border-left: 1px solid #000;

background-color: #CCCCCC;}

.inner-box {

padding:1em;

border-right: 1px solid #000;

border-left: 1px solid #000;

background-color: #CCCCCC;}</style>

Код HTML:

<table>

    <tr>

        <td>



            <div id="rounded-box-5">



                <i class="r5"></i>

                <i class="r3"></i>

                <i class="r2"></i>

                <i class="r1"></i>

                <i class="r1"></i>



                <div class="inner-box">

                    <table>

                        <tr>

                            <td>

                                text

                            </td>

                        </tr>

                    </table>

                </div>



                <i class="r1"></i>

                <i class="r1"></i>

                <i class="r2"></i>

                <i class="r3"></i>

                <i class="r5"></i>



            </div>



        </td>

    </tr>

</table>

В CSS 3 будет все проще, уже для движка safari & firefox можно использовать

PHP код:


		
			
#rounded-box-3 {

-moz-border-radius: 5px;

-webkit-border-radius: 5px; }

После чего весь блок будет с закруглениями

и когда ж оно будет?