Foros del Web - Ver Mensaje Individual

#1 (**permalink**) 13/09/2010, 14:45

Foreros :( he tirado la toalla... traté de todo pero no he logrado conseguirlo (además que no he dormido nada y ya no proceso), les cuento mi problema con la esperanza de que me puedan ayudar:

Primero que todo voy a mencionar que la parte de código que voy a poner es sólo una parte de contenido de toda la página que estoy armando (parte del medio, donde va el contenido central), así que les pegaré sólo ese fragmento. El problema es que mi div no se ajusta al contenido, es decir, tengo un div contenedor y dentro varios divs, pero el contenido de estos se sale de mi div contenedor, traté aplicando propiedades como height:auto, min-height, max-height... pero lo que quiero hacer es que a medida que más contenido tenga un div, más se agrande, quiero decir, que tenga tamaño dinámico, se entiende? Busqué en google el mismo problema pero nada, quizás es donde no proceso que se me está llendo un detalle, ojalá me puedan ayudar.

Les dejo el código, para esto consideren que el div color blanco es mi div contenedor y bueno, color gris oscuro es sólo el color de fondo del body:

Código:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<style type="text/css">
body {
	background-color:#333333;
}

.subContainer, #container2 {
	width: 900px;
	margin: 0 auto 0 auto; !important
}

#container2 {
	padding-left: 30px;
	padding-right: 30px;
}

#contentContainer {
	text-align: left;
	background-color:white;
}

#subContainer {
	padding-top: 20px;
	padding-bottom: 20px;
	padding-left: 30px;
	padding-right: 30px;
}

#top {
	border-bottom-style	: dotted;
	border-bottom-width: 2px;
	border-bottom-color	: #999999;
	padding-bottom: 20px;
	margin-bottom	: 20px;
}

#head {
	width: 780px;
}

#letter {
	position: relative;
	top: 35px;
	left: 27px;
}

#bottomC {
}

#formContent, #formTexts, #head {
	float: left;
}

#formTexts {
	width: 50px;
	line-height: 26px;
}

#form {
	padding-top: 5px;
}

#formContent {
	border-right-style: dotted;
	border-right-width: 2px;
	border-right-color: #999999;
	margin-right: 20px;
	padding-right: 20px;
}
</style>
</head>

<body>

<div id="container2"> <!-- CONTAINER 2 -->
<div id="contentContainer"> <!-- content -->
<div id="subContainer"> <!-- subContainer -->
<div id="top"> <!-- top -->
<div id="head"> <!-- head -->
<a class="titleText">CONTACTO</a>
 <br/><br/>
                        
<a class="miniTitle">ANTE SUS DUDAS CONSULTENOS</a>
<br/><br/>
                        
<a class="normalText">Este ciclo pretende adem&aacute;s revisar en forma general algunos conceptos clave, las principales fases del proceso de innovaci&oacute;n y los elementos centrales para una gesti&oacute;n de innovaci&oacute;n exitosa.</a>

</div> <!-- /head -->
                    
<div id="letter"> <!-- letter -->
<img src="img/letter.png"/>
</div> <!-- /letter -->
</div> <!-- /top -->
                
<div id="bottomC"> <!-- bottomC -->
<div id="formContent"> <!-- formContent -->
<img src="img/orangeBar.png"/>
<br/>
<div id="formTexts"> <!-- formTexts -->
<a class="formText">Nombre:</a>
<br/>
<a class="formText">Apellido:</a>
<br/>
<a class="formText">Cargo:</a>
<br/>
<a class="formText">E-Mail:</a>
<br/>
<a class="formText">Tel&eacute;fono:</a>
<br/>
<a class="formText">Consulta:</a>
<br/>
</div> <!-- /formTexts -->
                        
<div id="form"> <!-- form -->
<input type="text" name="nombre"/>
<br/>
<input type="text" name="apellido"/>
<br/>
<input type="text" name="cargo"/>
<br/>
<input type="text" name="email"/>
<br/>
<input type="text" name="telefono"/>
<br/>
<textarea class="formTextArea" name="consulta"></textarea>
<br/>
</div> <!-- /form -->
</div> <!-- /formContent -->
                    
<div id="details"> <!-- details -->
DETAILS
</div> <!-- /details -->
</div> <!-- /bottomC -->
</div> <!-- /subContainer -->
</div> <!-- /content -->
</div> <!-- /bottom -->
</div> <!-- /CONTAINER 2 -->
</body>

</html>

(Tenía las clases a nivel de hoja de estilo .css, así que hay algunas clases de texto que no están aquí, no son importantes por ahora)

Saludos y muchas gracias por darse el tiempo de leer, estaré muy agradecido con cualquier tipo de ayuda que me puedan otorgar.

Adiós!