Foros del Web » Creando para Internet » HTML »

¿Esto es imposible con DIVs?

Estas en el tema de ¿Esto es imposible con DIVs? en el foro de HTML en Foros del Web. Hola que tal gente!! Estoy volviendome loco intentado hacer con divs algo que con tablas es realmente simple... voy directo al grano, aqui va el ...
  #1 (permalink)  
Antiguo 20/08/2008, 06:29
 
Fecha de Ingreso: diciembre-2004
Mensajes: 721
Antigüedad: 13 años
Puntos: 2
Exclamación ¿Esto es imposible con DIVs?

Hola que tal gente!!

Estoy volviendome loco intentado hacer con divs algo que con tablas es realmente simple... voy directo al grano, aqui va el HTML:

Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<title>test</title>
	<style type='text/css'>
		BODY, HTML {
			height: 100%;
			width: 100%;
			margin:0;
			padding:0;
		}
	</style>

</head>
<body>

	<table width='100%' height='100%' border='0' cellpadding='0' cellspacing='0' style='background-color:gray;'>
		<tr>
			<td style='background-color:yellow;'>&nbsp;</td>

			<td width='700' height='100%'  style='background-color:red;'>
				<div style='width:500px; height: 500px; background-color: maroon; margin:auto;'>hola</div>
			</td>

			<td style='background-color:blue;'>&nbsp;</td>
		</tr>
	</table>

</body>
</html>
Es simple... tengo un centro de ancho FIJO en donde van los contenidos y dos barras laterales cuyo ancho debería ajustarse automaticamente al ancho total de la ventana. Cada uno de los cells aquí tendrá su imagen de fondo: El centro tendrá una imagen específica y los dos cells que se ajustan automaticamente tendrán un patrón repetitivo (una imagen de 1 px repetida). CADA una de las dos franjas laterales IZQ y DER van a tener una imagen diferente (por eso no estoy obligado a usar 2 contenedores).

La verdad ya no se como rayos hacer... tengo bastante experiencia maquetando con divs, lo vengo haciendo hace mucho y resolvi muchos problemas pero este me dejó por lejos sin más qué probar...

Con divs, cree 3 divs flotadas, mi primer aproach fue hacer un diseño liquido pero falló por que siempre a las divs laterales les tengo que definir un WIDTH exacto ya sea en PIXELS o PORCENTAJE...

¿Se podrá indicar a una div que se expanda tanto como le sea posible de forma automática y sin relación a su contenido, tal como lo hacen los TD de una tabla con width 100%?



MUCHAS GRACIAS GENTE !!!!!!!! Si me pueden dar una mano les voy a estar muy agradecido :)
  #2 (permalink)  
Antiguo 20/08/2008, 15:59
 
Fecha de Ingreso: agosto-2008
Mensajes: 2
Antigüedad: 9 años, 3 meses
Puntos: 0
Respuesta: ¿Esto es imposible con DIVs?

A ver veamos. Si a un div, le defines un ¨width¨o ancho este se queda fijo.
Si no le añades un width, lo haces líquido.
No entiendo mucho tu cuestión, realmente, si podrías explicarte mejor.
Yo crearía unos divs flotantes con posiciones absolutas y creo que eso funcionaría bien.
  #3 (permalink)  
Antiguo 20/08/2008, 16:58
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: ¿Esto es imposible con DIVs?

Prueba con esto:

Cita:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>test</title>
<style type='text/css'>
html, body {height: 100%;
width: 100%;
margin:0;
padding:0;
background-color:yellow;
}
#azul {background-color:blue;height: 100%;width: 600px;position: absolute;right: 0;top: 0;}
#rojo {background-color:red;width: 700px;height: 100%;margin: 0 auto;position: relative;}
#marron {background-color: maroon;width:500px; height: 500px; margin:auto;position: relative;top: 40px;}
</style>
</head>
<body>
<div id="azul"></div>
<div id="rojo">
<div id="marron">Hola</div>
</div>
</body>
</html>
__________________
Visita mi nueva web idplus.org
  #4 (permalink)  
Antiguo 27/08/2008, 09:53
 
Fecha de Ingreso: diciembre-2004
Mensajes: 721
Antigüedad: 13 años
Puntos: 2
Respuesta: ¿Esto es imposible con DIVs?

Eso parece funcionar... gracias por tu respuesta !
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 12:09.