borde de tabla demasiado ancho

zeico0 · #1 (**permalink**) 01/06/2010, 18:00

hola a todos, me gustaria saber como hacer para que en mis tablas se muestre un borde lo mas fino posible.

cuando le pongo de borde "1" se muestra el borde pero sigue siendo demasiado ancho y alguna vez he visto tablas con bordes bastante mas delgados pero nose como hacer para que aparezca asi..

tambien busque en css pero no encontre nada..alomejor no busque bien.

¿Qué puedo hacer?

zutzu · #2 (**permalink**) 01/06/2010, 18:21

algunos lo hacen así...

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento</title>
<style type="text/css">
table td{background:#FFF;}
table { background:#000;}
</style>
</head>

<body>
<table width="50%" cellspacing="1">
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>
</body>
</html>

zeico0 · #3 (**permalink**) 01/06/2010, 18:25

voy a probar a ver

zeico0 · #4 (**permalink**) 01/06/2010, 18:41

en mi caso ese metodo no sirve.. quiza debi esplicarme bien desde el principio.

tengo 2 tablas, una de ellas de una sola fila y columna contiene a la otra con varias columnas.

esto lo hago asi porque quiero que solo se muestre el borde exterior en vez de el borde de cada celda, en las celdas tengo puesta una imagen semitransparente que deja entrever el fondo y al poner en la tabla contenedora el fondo negro.. se malogra la imagen.

alguna otra solucion?

zutzu · #5 (**permalink**) 01/06/2010, 19:14

mm no termino de entender, si solo quieres un borde exterior a tu tabla, o que cada celda tenga borde?
en todo caso puedes jugar con la propiedad "border"

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento</title>
<style type="text/css">
.tabla2 {border-top:1px solid black;border-left:1px solid black;}
.tabla2 td{border-right:1px solid black;border-bottom:1px solid black;}
</style>
</head>

<body>
<table class="tabla2" width="100%" cellspacing="0">
         <tr>
          <td>&nbsp;</td>
          <td>&nbsp;</td>
          </tr>
          <tr>
         <td>&nbsp;</td>
        <td>&nbsp;</td>
     </tr>          
</table>
</body>
</html>

ahí no afectaría a tu imagen.
hubiera sido mejor que dejes tu html.

zeico0 · #6 (**permalink**) 01/06/2010, 19:58

ya encontre la solucion siguiendo tu idea de jugar con el css.. aveces la tenemos delante y no la vemos xD

era asi de sencillo

Código HTML:

.tablacontenedora {
 	border:1px;
 	border-style:solid;
 	border-color:#000;
	background-image:url(images/fondotable-trans.png)	
	}

zutzu · #7 (**permalink**) 01/06/2010, 20:13

puedes ganar un poquito mas de bytes

Código HTML:

.tablacontenedora {
 	border:1px solid #000;
	background-image:url(images/fondotable-trans.png)	
	}

y yo que pensaba que querías tener todo con bordes, incluido celdas U.U

zeico0 · #8 (**permalink**) 01/06/2010, 20:28

Lo que queria es tener solo un borde exterior, por eso lo de usar 2 tablas.. una tabla A dentro de otra tabla B para organizar con margenes y todo bien en su sitio y la tabla B con un fondo semitransparente y un borde lo mas delgado posible, cosas de estetica xD

pero aun asi me guardo la primera idea que me diste.. que puede servirme para mas de una ocasion, esta bien pensada.

Gracias por todo y buenas noches que me voy a la cama xD