Foros del Web » Creando para Internet » CSS »

DIV ajustado al contenido

Estas en el tema de DIV ajustado al contenido en el foro de CSS en Foros del Web. Hola a todos. Soy nuevo en este foro y tengo una duda que trae por la calle de la amargura, a ver si somos capaces ...
  #1 (permalink)  
Antiguo 17/01/2011, 06:53
 
Fecha de Ingreso: enero-2011
Mensajes: 26
Antigüedad: 13 años, 3 meses
Puntos: 1
DIV ajustado al contenido

Hola a todos.

Soy nuevo en este foro y tengo una duda que trae por la calle de la amargura, a ver si somos capaces de solucionarlo entre todos.

Al grano: Estoy haciendo una web que maneja sólo un estilos.css y un index.html que alberga tooodo el contenido (el profesor lo quiere así). Ésto supone una buena castaña, porque los enlaces internos se mostrarán en una caja (div) que contendrá a otra usando identificadores, y para "recortar" usamos la propiedad overflow:hidden para la caja madre y overflow:auto para las cajas hijas

El problema que tengo es que si las cajas hijas se pasan de height:100%, el contenido se corta quedando horriblemente feo y sólo se soluciona moviendo la rueda del ratón.

¿HAY ALGUNA FORMA DE QUE EL DIV MADRE SE AJUSTE AL CONTENIDO DEL DIV HIJO?

Código CSS:

Caja madre y caja hija

div#cont1 {
margin-top: 10px;
margin-right:130px;
margin-left:250px;
overflow:hidden;
text-align:justify;
height:100%;
color:black;
}

div#cont2 {
height:100%;
width:100%;
padding:20px;
overflow:auto;
}
  #2 (permalink)  
Antiguo 17/01/2011, 07:57
 
Fecha de Ingreso: enero-2011
Mensajes: 26
Antigüedad: 13 años, 3 meses
Puntos: 1
Respuesta: DIV ajustado al contenido

Por favor, ayudadme
  #3 (permalink)  
Antiguo 17/01/2011, 08:19
Avatar de uikekarallo  
Fecha de Ingreso: diciembre-2009
Ubicación: Galicia
Mensajes: 338
Antigüedad: 14 años, 3 meses
Puntos: 16
Respuesta: DIV ajustado al contenido

no entiendo muy bien el problema sin ver el html. ¿podrías poner el código html?

un saludo.
  #4 (permalink)  
Antiguo 17/01/2011, 08:22
 
Fecha de Ingreso: enero-2011
Mensajes: 26
Antigüedad: 13 años, 3 meses
Puntos: 1
Respuesta: DIV ajustado al contenido

ok

Código HTML

CUERPO:

<div id="cont1">
<div class="transp">

<a name="princ">
<div id="cont2">
Bienvenido a la web sobre el Sistema Solar exterior. Se mostrará información sobre los
astros que se encuentran más allá del Cinturón de Asteroides.
</div>
</a>

<div id="cont2">
<a name="jupiter"><center><span class="cabtext">Júpiter</span></center></a>
<p>Júpiter es el quinto planeta del Sistema Solar. Forma parte de los denominados planetas exteriores o
gaseosos. Recibe su nombre del dios romano Júpiter (Zeus en la mitología griega).</p>

<p>Se trata del planeta que ofrece un mayor brillo a lo largo del año dependiendo de su fase. Es, además,
después del Sol, el mayor cuerpo celeste del Sistema Solar, con una masa casi dos veces y media la de
los demás planetas juntos (con una masa 318 veces mayor que la de la Tierra y 3 veces mayor que la de
Saturno).</p>

<p>Júpiter es un cuerpo masivo gaseoso, formado principalmente por hidrógeno y helio, carente de una
superficie interior definida. Entre los detalles atmosféricos se destacan la Gran mancha roja, un
enorme anticiclón situado en las latitudes tropicales del hemisferio sur, la estructura de nubes en
bandas y zonas, y la fuerte dinámica de vientos zonales con velocidades de hasta 140 m/s (504 km/h).
Se piensa que puede ser una "Estrella fallida" debido a sus grandes cantidades de hidrógeno y helio.
</p>


<center><span class="cabtext">Descripción del interior de Júpiter</span></center>

<p>Los planetas gigantes no tienen la misma estructura de capas que los planetas terrestres. Su evolución
fue muy diferente a la de los planetas terrestres, y tienen menor cantidad de material sólido.</p>

<p>La composición del interior de Júpiter es fundamentalmente de moléculas simples tales como hidrógeno y
helio, los cuales son líquidos, y no sólidos, que se encuentran a muy alta presión en el interior de los
planetas exteriores.</p>

<p>Los movimientos en el interior de Júpiter contribuyen, de manera especial, con el desarrollo de una
extensa magnetosfera en Júpiter. El calor generado dentro de Júpiter contribuye con los movimientos poco
comunes de la atmósfera.</p>

</div>

<div id="cont2">
<a name="saturno"><center><span class="cabtext">Saturno</span></center></a>
<p>
Saturno es el segundo planeta más grande del Sistema Solar y el único con anillos visibles desde la Tierra.
Se ve claramente achatado por los polos a causa de la rápida rotación.</p>

<p>La atmósfera es de hidrógeno, con un poco de helio y metano. Es el único planeta que tiene una densidad
menor que el agua. Si encontrásemos un océano suficientemente grande, Saturno flotaría. </p>

<p>El color amarillento de las nubes tiene bandas de otros colores, como Júpiter, pero no tan marcadas. Cerca
del ecuador de Saturno el viento sopla a 500 Km/h. </p>

<p>Los anillos le dan un aspecto muy bonito. Tiene dos brillantes, A y B, y uno más suave, el C. Entre ellos
hay aberturas. La mayor es la División de Cassini.Cada anillo principal está formado por muchos anillos estrechos.
Su composición es dudosa, pero sabemos que contienen agua. Podrían ser icebergs o bolas de nieve, mezcladas con polvo.</p>

<p>En 1850, el astrónomo Edouard Roche estudiaba el efecto de la gravedad de los planetas sobre sus satélites, y
calculó que, cualquier materia situada a menos de 2,44 veces el radio del planeta, no se podría aglutinar para
formar un cuerpo, y, si ya era un cuerpo, se rompería. </p>

<p>El anillo interior de Saturno, C, está a 1,28 veces el radio, y el exterior, el A, a 2,27. Los dos están dentro
del límite de Roche, pero su origen todavía no se ha determinado. Con la materia que contienen se podría formar una
esfera de un tamaño parecido al de la Luna.
</p>

</div>
  #5 (permalink)  
Antiguo 17/01/2011, 08:41
Avatar de uikekarallo  
Fecha de Ingreso: diciembre-2009
Ubicación: Galicia
Mensajes: 338
Antigüedad: 14 años, 3 meses
Puntos: 16
Respuesta: DIV ajustado al contenido

ok, comprendido :)

se te veía solamente la primera capa.

cambia el valor de height estableciéndolo en auto en ambos selectores de la hoja de estilos y prueba entonces.

saludos.
  #6 (permalink)  
Antiguo 17/01/2011, 11:03
 
Fecha de Ingreso: enero-2011
Mensajes: 26
Antigüedad: 13 años, 3 meses
Puntos: 1
Respuesta: DIV ajustado al contenido

No, no me has entendido... Es que es difícil de explicar.
Lo que quiero conseguir es que todo esté en un sólo documento HTML.
Tengo un menú izquierdo con enlaces internos a las cajas #cont2 que tiene el overflow:auto dentro de la caja principal #cont1 con overflow:hidden
  #7 (permalink)  
Antiguo 17/01/2011, 11:55
 
Fecha de Ingreso: enero-2011
Mensajes: 26
Antigüedad: 13 años, 3 meses
Puntos: 1
Respuesta: DIV ajustado al contenido

Alguna idea?
  #8 (permalink)  
Antiguo 17/01/2011, 11:57
Avatar de sanxuan  
Fecha de Ingreso: enero-2011
Ubicación: Gijón
Mensajes: 671
Antigüedad: 13 años, 3 meses
Puntos: 36
Respuesta: DIV ajustado al contenido

Perdon por mi ignorancia. ¿Hay alguna razón para repetir el id en más de una etiqueta HTML?
Soy casi tan nuevo como tú en este foro. Creo que sería de bastante ayuda poder ver tu página en funcionamiento. Hay servidores gratuitos. Poner tu página en uno de ellos y colocar un enlace no debería suponer mucho esfuerzo. Ahorraríamos tiempo.
Un saludo.
  #9 (permalink)  
Antiguo 17/01/2011, 14:23
Avatar de uikekarallo  
Fecha de Ingreso: diciembre-2009
Ubicación: Galicia
Mensajes: 338
Antigüedad: 14 años, 3 meses
Puntos: 16
Respuesta: DIV ajustado al contenido

pues si que es difícil de explicar... porque no logro entenderlo así de primeras. me vienen muchas cosas a la cabeza.

en cuanto a lo que dice sanxuan, que yo no me había fijado, nunca debes utilizar el mismo identificador 2 veces. cuando quieras establecer las mismas propiedades para los elementos, utiliza siempre clases.
y de nuevo apoyando los comentarios de sanxuan, si nos pones el ejemplo "online" seguro que te podemos ayudar más y mejor.

un saludo.

Etiquetas: contenido
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:44.