Cajas Redondeadas Sin Imágenes

¿Cansado de tener que recortar 4 imágenes o más para hacer unas simples cajas redondeadas?

¡Aquí tienes la solución! Cajas redondeadas 100% CSS y sin usar ninguna imágen.

ESTO AL CSS o
:

div#nifty{ margin: 0 10%;background: #9BD1FA}
b.rtop, b.rbottom{display:block;background: #FFF}
b.rtop b, b.rbottom b{display:block;height: 1px;
overflow: hidden; background: #9BD1FA}
b.r1{margin: 0 5px}
b.r2{margin: 0 3px}
b.r3{margin: 0 2px}
b.rtop b.r4, b.rbottom b.r4{margin: 0 1px;height: 2px}

EL HTML:

<div id=»nifty»>
<b class=»rtop»><b class=»r1″></b><b class=»r2″></b><b class=»r3″></b><b class=»r4″></b></b>
<br />
&nbsp;&nbsp;Precioso
<br />&nbsp;
<b class=»rbottom»><b class=»r4″></b><b class=»r3″></b><b class=»r2″></b><b class=»r1″></b></b>
</div>

>>> VER EJEMPLO

Autor: Janmi

Janmi es un informático entusiasta de la ciencia ficción, el diseño gráfico, el universo de Tolkien, fantasía épica y otras cosas frikis. Apasionado por la tecnología, ya sea desde el punto de visto técnico, domótico, funcional o de diseño.