Tablas con bordes redondos.

[bbrian]

Como hago para que mis tablas tengan bordes redondos asi como los de esta web:

http://www.velezsarsfield.com.ar/

Si se fijan bien cuando entras a la web y bajas un poco dice efemerides y alado agenda de eventos. Bueno esas 2 tablas tienen bordes redondos, yo quisiera hacer algo asi...

Espero que puedan ayudarme saludos !

[edordz]

Necesitas crear una imagen con los bordes redondos, ya sea con photoshop, illustrator o el software que utilices para diseñar. Ya después lo maquetas en el lugar que lo ocupes.

Saludos

------------------------------

http://twitter.com/edordz

[bbrian]

Pero lo quiero hacer con css, porque necesito que la tabla tenga fondo como en la web que pase.

[millan2525]

-moz-border-radius

Usa esa expresión, pero en IE no va... Bueno, en la última versión no lo sé.

Un saludo

Simplemente tienes que añadir eso al ID del div... Si no usas div, no te va ;)

[bbrian]

no entiendo como usar -moz-border-radius

alguno sabe como usar bien el NiftyCube ???

[TEPO]

bbrian, con css no hay manera de hacer bordes redondos sin que tengas algun inconveniente en cuanto a la compatibilidad con otros navegadores, ya que no todos los leen, pero hay una solucion a tu problema, espero que lo entiendas, tratare de explicarlo lo mejor posible, antes que nada neceitas crear dos imagenes en illustrator o photoshop o en el programa grafico que vos utilices, estas imagenes son la parte de arriba de la caja y la parte de abajo de la caja, es decir las dos partes donde se ven las formas redondeadas, se entiende?, a la parte de arriba la llamas top y a la parte de abajo bottom, con css uniremos esas dos imagenes y luego les daremos el alto que queramos, el codigo xhtml a utilizar ahora es el siguiente:

<div class="box">
<h2>Titulo de la caja</h2>
<p>contenido de la caja</p>
</div>

El codigo css:
.box {
width: xx px;
background: #000 url ( la ruta a la imagen bottom) no-repeat left bottom;
}
.box h2 {
background:url (la ruta de la imagen top) no-repeat left top;
}

O sea, lo que hicimos es lo siguiente se aplico la imagen que creaste (bottom) a la parte inferior del div, para crear el estilo de la caja añadis un color de fondo al div de la caja, despues aplicamos la imagen top al elemento de cabecera.-
si necesitas añadir algo de relleno a los elementos del div, podes hacer lo siguiente:

.box h2{
padding: xxpx xxpx xxpx xxpx;
}
.box p{
padding: xxpx xxpx xxpx xxpx:
}

No es para nada complicado, espero que hayas entendido lo de las imagenes que tenes que crear. Saludos.-

[jomaruro]

Hola:

En la página del compañero Mikmoro, www.araudi.net, en la sección de elementos tienes unos ejemplos de esquinas redondeades hechos de distintas formas.

Además si buscas en google esquinas redondeadas css, encontraras cientos de ejemplos.

Saludos.