Llevo bastante rato queriendo que el height de un contenedor de mi web sea dinámico pero no lo consigo.
Lo que quiero conseguir es que cuando pinche en el tercer tab (tab-3) el height del content se amolde al tamaño que ocupa el texto, ya que el height no varía y no aparece todo el texto.
Os dejo el CSS y el HTML para a ver si me podeis ayudar:
Código CSS:
Ver original.content {
background: #fff;
position: relative;
width: 100%;
height: 370px;
z-index: 5;
overflow: hidden;
box-shadow: 0 -2px 3px -2px rgba(0,0,0,0.2), 0 2px 2px rgba(0,0,0,0.1);
border-radius: 0 3px 3px 3px;
}
Código HTML:
Ver original <input id="tab-1" type="radio" name="radio-set" class="tab-selector-1" checked="checked" /> <label for="tab-1" class="tab-label-1">Misi
ón
</label>
<input id="tab-2" type="radio" name="radio-set" class="tab-selector-2" /> <label for="tab-2" class="tab-label-2">Visi
ón
</label>
<input id="tab-3" type="radio" name="radio-set" class="tab-selector-3" onClick="ChangeSize()" value="ChangeSize" /> <label for="tab-3" class="tab-label-3">Valores
</label>
<div class="clear-shadow"></div>
<p>Aprender mientras nos desarrollamos personalmente y como equipo
cumpliendo nuestras metas.
</p> <p>Para el 24 de Junio del 2015, queremos conseguir una satisfacci
ón conjunta de aprendizaje
y trabajo realizado, adem
ás de estar orgullosos de los cuatro años en Kibber.
</p> <p>La naturalidad es nuestro modo de vida, y tratamos de reflejar eso en cada proyecto.
</p><br /> <p>La calidad de nuestro trabajo aumenta d
ía a d
ía.
</p><br /> <p>Aprendemos mientras desarrollamos proyectos que traten de encontrar nuestras pasiones.
</p> <p>A trav
és de nuestro esp
íritu joven y energ
ía
superamos nuestros propios l
ímites.
</p><br /> <p>Damos lo mejor de nosotros mismos por y para nuestros compañeros.
</p><br /> <p>Consideramos que somos emp
áticos y humanos.
</p><br /> <p>Nos gusta dar un toque de felicidad y diversi
ón
a cada proyecto que realizamos.
</p> <p>Estamos abiertos a realizar proyectos con cualquier persona que quiera emprender
sin tener en cuenta el entorno socioecon
ómico y cultural.
</p><br /> <p>Tratamos siempre de reforzar todas las lenguas que se hablan en el equipo,
principalmente ingl
és, euskera y castellano.
</p><br /> <p>Entendemos los viajes de aprendizaje (Learning journeys) como herramienta b
ásica para
la expansi
ón de nuestros conocimientos, mejora profesional, desarrollo personal.
</p> <p>Nos consideramos parte activa de MTA realizando proyectos con diferentes equipos
de la comunidad, participando con constancia en sus eventos y estando siempre
dispuestos a ayudar a aqu
él que lo requiera.
</p><br /> <p>Creemos fuertemente en que el trabajo equipo debe ser el soporte de toda actividad,
aumentando as
í el aprendizaje y conocimiento obtenidos.
</p>
Y la función ChangeSize:
Código Javascript
:
Ver original<script type="text/javascript">
function ChangeSize(){
content = document.getElementById("content");
content.style.height = 600px;
}
</script>