Como ajustar o tamanho de uma tabela utilizando CSS

andresl · 24/04/2014

Hola, recientemente me han actualizado la plantilla pero tengo un problema.

Al anterior plantilla podria poner el post con la plantilla completa pero con la nueva plantillla no puedo hacerlo, asi que he leido que puedo modificar el CSS para que la tabla tenga un tamaño predefino, es decir de 600 y no de 850 que es el que tiene.

mi css es

PHP:

table a:link {
	color: #666;
	font-weight: bold;
	text-decoration: none;
}

table a:visited {
	color: #999999;
	font-weight: bold;
	text-decoration: none;
}

table a:active,
table a:hover {
	color: #bd5a35;
	text-decoration: underline;
}

table {
	font-family: Arial, Helvetica, sans-serif;
	color: #666;
	font-size: 12px;
	text-shadow: 1px 1px 0 #fff;
	background: #eaebec;
	margin: 20px;
	border: #ccc 1px solid;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	-moz-box-shadow: 0 1px 2px #d1d1d1;
	-webkit-box-shadow: 0 1px 2px #d1d1d1;
	box-shadow: 0 1px 2px #d1d1d1;
}

table th {
	padding: 21px 25px 22px;
	border-top: 1px solid #fafafa;
	border-bottom: 1px solid #e0e0e0;
	background: #ededed;
	background: -webkit-gradient(linear,left top,left bottom,from(#ededed),to(#ebebeb));
	background: -moz-linear-gradient(top,#ededed,#ebebeb);
}

table th:first-child {
	text-align: left;
	padding-left: 20px;
}

table tr:first-child th:first-child {
	-webkit-border-top-left-radius: 3px;
	border-top-left-radius: 3px;
}

table tr:first-child th:last-child {
	-webkit-border-top-right-radius: 3px;
	border-top-right-radius: 3px;
}

table tr {
	text-align: center;
	padding-left: 20px;
}

table td:first-child {
	text-align: left;
	padding-left: 20px;
	border-left: 0;
}

table td {
	padding: 18px;
	border-top: 1px solid #ffffff;
	border-bottom: 1px solid #e0e0e0;
	border-left: 1px solid #e0e0e0;
	background: #fafafa;
	background: -webkit-gradient(linear,left top,left bottom,from(#fbfbfb),to(#fafafa));
	background: -moz-linear-gradient(top,#fbfbfb,#fafafa);
}

table tr.even td {
	background: #f6f6f6;
	background: -webkit-gradient(linear,left top,left bottom,from(#f8f8f8),to(#f6f6f6));
	background: -moz-linear-gradient(top,#f8f8f8,#f6f6f6);
}

table tr:last-child td {
	border-bottom: 0;
}

table tr:last-child td:first-child {
	-webkit-border-bottom-left-radius: 3px;
	border-bottom-left-radius: 3px;
}

table tr:last-child td:last-child {
	-webkit-border-bottom-right-radius: 3px;
	border-bottom-right-radius: 3px;
}

table tr:hover td {
	background: #f2f2f2;
	background: -webkit-gradient(linear,left top,left bottom,from(#f2f2f2),to(#f0f0f0));
	background: -moz-linear-gradient(top,#f2f2f2,#f0f0f0);
}

la pagina es esta Ranking brokers opciones binarias - Lista de plataformas reguladas donde esta la tabla.

Gracias

erperez · 24/04/2014

¿Dónde está definido el ancho de 850? Porque ahí es donde tendrías que modificarlo y poner 600.

Si no, tendrías que poner width: 600px; en table. (Antes de modificar nada copia el código)

andresl · 24/04/2014

erperez disse:
¿Dónde está definido el ancho de 850? Porque ahí es donde tendrías que modificarlo y poner 600.

Si no, tendrías que poner width: 600px; en table. (Antes de modificar nada copia el código)

Hola, no tiene ningun tamaño predefinido, antes cuando publicaba la tabla tenia una tamaño de 850 que se ponia el mismo no yo.

Para realizar la tabla no puse ningun tamaño, solo puse la información, ahora quiero ponerte un tamaño pero no se como, por eso puse el CSS para que tenga un tamaño predefinido la tabla

Saludos

erperez · 24/04/2014

andresl disse:
Hola, no tiene ningun tamaño predefinido, antes cuando publicaba la tabla tenia una tamaño de 850 que se ponia el mismo no yo.

Para realizar la tabla no puse ningun tamaño, solo puse la información, ahora quiero ponerte un tamaño pero no se como, por eso puse el CSS para que tenga un tamaño predefinido la tabla

Saludos

Prueba a poner
width: 600px;
dentro de las llaves de table de esta manera:
table {
width:600px;
y debajo todo lo demás
....
}

Como ajustar o tamanho de uma tabela utilizando CSS

andresl

erperez

andresl

erperez

Tópicos similares