Foros del Web » Creando para Internet » CSS »

anchura columna

Estas en el tema de anchura columna en el foro de CSS en Foros del Web. Buenos dias, El problema que me ha surgido realizando un página es el siguiente. Tengo dos colummnas de posición absoluta y con una imagen en ...
  #1 (permalink)  
Antiguo 09/07/2007, 03:28
 
Fecha de Ingreso: junio-2007
Mensajes: 37
Antigüedad: 10 años, 6 meses
Puntos: 0
anchura columna

Buenos dias,
El problema que me ha surgido realizando un página es el siguiente.
Tengo dos colummnas de posición absoluta y con una imagen en background (de un ancho como el de la columna y un alto de 1px y repetida en y).
Al añadir a los div de esas columnas unos textos(<p>) de cierta longitud las columnas no guardan el ancho y la columna se alarga en IE y en MF se sale el texto de la columna.
Este es el código por si me podeis ayudar.

Código:
* { margin:0; padding:0; }
.limpia{
	clear: both;
}
body{
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	padding: 0px;
	margin: 0px;
}
#container{
	width: 762px;
	background-image: url(../imagenes/header_background.jpg);
	height: 600px;
	border: 1px solid #007a63;
	background-repeat: repeat-x;
	margin: 0px auto;
	position: relative;
}
#izq{
	background-image: url(../imagenes/back_menu.jpg);
	background-repeat: repeat-y;
	width: 170px;
	border: 1px solid #007a63;
	position: absolute;
	top: 5px;
	left: 10px;
}
#menu{
}
#contenido{
	border: 1px solid #007a63;
	position: absolute;
	top: 25px;
	background-image: url(../imagenes/back_contenido.jpg);
	background-repeat: repeat-y;
	width: 565px;
	right: 5px;
	background-color: #FFFF00;
}
#interior_contenido{
	width: 565px;
}
Código:
<body>
<div id="container">
<div id="izq">
<div id="menu">
    <ul>
	   <li><a href="#">link 1</a></li>
	   <li><a href="#">link 1</a></li>
	   <li><a href="#">link 1</a></li>
	   <li><a href="#">link 1</a></li>
	   <li><a href="#">link 1</a></li>
	   <li><a href="#">link 1</a></li>
	   <li><a href="#">link 1</a></li>
	   <li><a href="#">link 1</a></li>
	 </ul>
	 </div>
</div>

<div id="contenido"><p>hdddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddjf</p>
<div id="interior_contenido"><p>jkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkkk</p></div>
</div>
</div>
</body>
</html>
Gracias por vuestra ayuda y un saludo
  #2 (permalink)  
Antiguo 09/07/2007, 05:21
 
Fecha de Ingreso: junio-2007
Mensajes: 37
Antigüedad: 10 años, 6 meses
Puntos: 0
Re: anchura columna

Bueno ya solucioné este problemilla. No se exactamente cómo, de tantas pruebas. Pero creo que funcionó al aplicar un overflow y luego quitarlo. ¡No lo entiendo!.
Pero he aqui que aparece otro problema. El contenedor no llega al final de la columna más larga. Este problema me surgió antes y lo solucione con un:
.limpia{ clear:both}
pero ahora eso no me funciona o lo aplico mal.
Si podeis ayudarme este es ell código:
Código:
.limpia{
	clear: both;
}
body{
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	padding: 0px;
	margin: 0px;
}
#container{
	width: 762px;
	background-image: url(../imagenes/header_background.jpg);
	border: 1px solid #007a63;
	background-repeat: repeat-x;
	margin: 0px auto;
	position: relative;
	height: auto;
	}
#izq{
	background-image: url(../imagenes/back_menu.jpg);
	background-repeat: repeat-y;
	width: 170px;
	border: 1px solid #007a63;
	position: absolute;
	top: 5px;
	left: 10px;
}
#menu{
}
#contenido{
	border: 1px solid #007a63;
	position: absolute;
	top: 25px;
	background-image: url(../imagenes/back_contenido.jpg);
	background-repeat: repeat-y;
	width: 565px;
	right: 5px;
	background-color: #FFF;
}
#interior_contenido{
	width: 565px;
}
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 02:31.