Foros del Web » Creando para Internet » CSS »

layout 3 columnas + interior

Estas en el tema de layout 3 columnas + interior en el foro de CSS en Foros del Web. bien soy bastante novato en estos temas.. la cosa es que intento hacer una pagina dividida en 4 un contenedor 2 divs laterales que harian ...
  #1 (permalink)  
Antiguo 06/10/2011, 17:04
 
Fecha de Ingreso: enero-2009
Mensajes: 40
Antigüedad: 13 años, 6 meses
Puntos: 0
layout 3 columnas + interior

bien soy bastante novato en estos temas.. la cosa es que intento hacer una pagina dividida en 4 un contenedor 2 divs laterales que harian de margen que contienen otro interior de 1px con un degradado .. y despues tengo el div del medio donde meteria la cabecera, menu, contenido y pie..

he intentado mil cosas.. peró siempre tengo problemas.. sobre todo que los laterales no crezcan con el del medio..

esto es lo último que he intentado..

Código:
<html>
	<head>
	<link rel="stylesheet" href="nuevocss.css" type="text/css">
	</head>

	<body>

		<div id="contenedor">

			<div id="lateralizq">
				<div style="background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.33) 50%, rgba(0,0,0,0.65) 100%); /* FF3.6+ */
					background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(50%,rgba(255,255,255,0.33)), color-stop(100%,rgba(0,0,0,0.65))); /* Chrome,Safari4+ */
					background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.33) 50%,rgba(0,0,0,0.65) 100%); /* Chrome10+,Safari5.1+ */
					background: -o-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.33) 50%,rgba(0,0,0,0.65) 100%); /* Opera11.10+ */
					background: -ms-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.33) 50%,rgba(0,0,0,0.65) 100%); /* IE10+ */
					filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#a6000000',GradientType=1 ); /* IE6-9 */
					background: linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.33) 50%,rgba(0,0,0,0.65) 100%); /* W3C */">
				</div>
			</div>



			<div id="contenido">

				Hola<br><br><br><br><br>Hola<br><br><br><br><br>
			</div>
			<div id="lateralder">
			</div>
		</div>
	</body>

</html>
y el css

Código:
 #contenedor { width:100%; height: auto; margin:auto; padding:0;  display: table;}
 	
 	#lateralizq { display:table-cell; width:10%;height:100%;}
 
 	
 	#lateralder {  display:table-cell; background-color:yellow;width:10%;height:100%; }
 	
 	#contenido { display:table-cell;  width:80%; background-color:red; }
 	
 	#degraizq { display:table-cell; height:100%;width:10px;float:right; background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.33) 50%, rgba(0,0,0,0.65) 100%); /* FF3.6+ */
					background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(50%,rgba(255,255,255,0.33)), color-stop(100%,rgba(0,0,0,0.65))); /* Chrome,Safari4+ */
					background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.33) 50%,rgba(0,0,0,0.65) 100%); /* Chrome10+,Safari5.1+ */
					background: -o-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.33) 50%,rgba(0,0,0,0.65) 100%); /* Opera11.10+ */
					background: -ms-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.33) 50%,rgba(0,0,0,0.65) 100%); /* IE10+ */
					filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#a6000000',GradientType=1 ); /* IE6-9 */
					background: linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.33) 50%,rgba(0,0,0,0.65) 100%); /* W3C */
					}
perdon si hay errores .. són simples pruebas.. alguien me puede decir como cojones se maqueta una página en condiciones? muchas gracias de antemano..

Etiquetas: chrome, columnas, contenido, html, interior, layout, fondo
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 04:35.