Hacer que este código funcione

abuenog · #1 (**permalink**) 09/08/2011, 08:29

Hola,

alguien podría ayudarme a hacer que funcione bien el tamaño de las celdas de este código en firefox? Al ser la resolución de la pantalla más pequeña me adapta las celdas sin tener en cuenta el tamaño de estas. Como podría solucionarlo?

Gracias

Código HTML:

<!DOCTYPE html>
<html>
<body>
<table>
	<tr>
		<td width="500" bgcolor="red" nowrap="nowrap">.</td>
		<td width="500" bgcolor="blue" nowrap="nowrap">.</td>
		<td width="500" bgcolor="green" nowrap="nowrap">.</td>
	</tr>
</table>
</body>
</html>

viringas · #2 (**permalink**) 09/08/2011, 10:46

prueba con colspan=2 aunq no creo q este ahi el problema

ArturoGallegos · #3 (**permalink**) 09/08/2011, 13:48

para querer utilizar html5 estas usando etiquetas obsoletas

bgcolor ya esta fuera de uso y es recomendable no escribir los colores como red si no en su forma hexagesimal eg. rojo -> #f00

y para tu problema quita

Cita:

width="500" bgcolor="red" nowrap="nowrap"

y colócalo en el css

Código CSS:

Ver original#tabla1{width:1500px;}
#tabla1 td{width:500px;white-space:nowrap;}
#tabla1 .c1{background:#f00;}
#tabla1 .c2{background:#00F;}
#tabla1 .c3{background:#396;}

Código HTML:

Ver original<table id="tabla1">
    <tr>
        <td class="c1">.</td>
        <td class="c2">.</td>
        <td class="c3">.</td>
    </tr>
</table>

abuenog · #4 (**permalink**) 09/08/2011, 14:55

Hola, gracias por tu ejemplo. Muy instructivo.

Tenía conocimiento de los cambios que me comentas, pero para el ejemplo ya me servía así de simplicado.
Aún así sigue sin servirme el ejemplo, ya que mi problema es que no puedo definir un width a la tabla.
Y es que en realidad mi caso es bastante más complejo. En mi caso tengo algunas celdas de las cuales desconozco el ancho. Sería algo así:

Código HTML:

 <table id="tabla1">
        <tr>
            <td class="c0">.</td>
            <td class="c1">.</td>
            <td class="c2">.</td>
            <td class="c3">.</td>
        </tr>
    </table>

Donde c0 es una celda sin ningún tamaño concreto y las otras tres con tamaño fijo.
Hay alguna manera de forzar a que las otras tres celdas tengan el tamaño de 500px sin que el navegador me las haga más pequeñas?

Gracias nuevamente

ArturoGallegos · #5 (**permalink**) 09/08/2011, 15:00

cambia

Código CSS:

Ver original#tabla1 td{width:500px;white-space:nowrap;}

por

Código CSS:

Ver original#tabla1 td{min-width:500px;white-space:nowrap;}

Nota: compatible con IE7 o superior

abuenog · #6 (**permalink**) 09/08/2011, 15:06

Perfecto! Muchas gracias.

Aunque la nota que has puesto al final me ha fastidiado un poco, la felicidad nunca puede ser completa, jeje.

solhdeck · #7 (**permalink**) 09/08/2011, 18:29

Código HTML:

<!DOCTYPE html>
<html>
<body>
<table width="1500">
	<tr>
		<td width="500" bgcolor="red" nowrap="nowrap">.</td>
		<td width="500" bgcolor="blue" nowrap="nowrap">.</td>
		<td width="500" bgcolor="green" nowrap="nowrap">.</td>
	</tr>
</table>
</body>
</html>

Así es más sencillo y funciona en todos lados o.o

¿Por qué a la gente le gusta complicarse la vida?

ArturoGallegos · #8 (**permalink**) 09/08/2011, 19:28

Cita:

Iniciado por solhdeck

Código HTML:

<!DOCTYPE html>
<html>
<body>
<table width="1500">
    <tr>
        <td width="500" bgcolor="red" nowrap="nowrap">.</td>
        <td width="500" bgcolor="blue" nowrap="nowrap">.</td>
        <td width="500" bgcolor="green" nowrap="nowrap">.</td>
    </tr>
</table>
</body>
</html>

Así es más sencillo y funciona en todos lados o.o

¿Por qué a la gente le gusta complicarse la vida?

en primera el compañero dijo que no puede especificar el ancho de la tabla

y en segunda no nos complicamos la vida, por el contrario no la facilitamos... nos gusta aprender y avanzar con la tecnología, para poder trabajar conforme a los nuevos estándares si no al 100% por lo menos lo intentamos...

no es bueno seguir utilizando etiquetas obsoletas y quedarse a vivir en el siglo pasado que te pueden parecer mas sencillas pero terminas haciendo un desmadre que te perderás, sera mas complicado dar mantenimiento y harás mucho mas pesado tu sitio y por consiguiente mas lenta su carga.