[eside-ghost] De CSS y <div>...

[Saúl Ibarra]

Soys unos cracks!!!!!!!!!!!! Funcionaaaaaaa!!!!! La ventana no se descuadra
al resizarla ni nada, al pelo!! Ahora, me he dado cuenta de que cuando el
contenido es más grande que el div "contenido" (por ejemplo a 800x600) se
sale por fuera. He probado a poner el height en uto, pero no hace lo que
quiero... Lo que pretendo (igual es imposible?) es que menu y contenido
esten pegados a footer, pero que si el contenido es más grande que el div,
se "estire" la ventana, para que el contenido quepa en el div, sin dejar de
estar pegado al footer. Nu se si me he explicadu...

PD: Muchisimas gracias por vuestra ayuda!!!!!!!!!

El día 28/04/07, Jon Ander Hernández <hernandez en movimage.com> escribió:
>
> Aupi!
>
> El vie, 27-04-2007 a las 19:52 +0200, Javier Ortega Conde (Malkavian)
> escribió:
>
> > Bueno al meollo:
> >
> > Has ajustado la capa del menu de la izquierda y del contenido a la
> derecha
> > para que ocupen casi todo el ancho. El ancho del menu es 20% y del
> > contenido 78%. Eso es un total del 98% y al sumarle los pixelitos de
> > padding y border que pones llegara al 99 o 100% supongo. Al reducir la
> > resolución esos pixelitos que no están en porcentaje pueden suponer que
> > llegue a más del 100% y por ello hay descuadre.
>
> Exacto :-)
>
> > Soluciones:
> >
> > 1- Reducir el padding y/o el border.
> > 2- O mejor supongo: Reducir el ancho al 19% y al 77% y así he comprobado
> > que se descuadra por debajo de los 660 píxeles de ancho de resolución.
> Si
> > quieres que se vea también bien a 640x480 pues quita un poquito más y
> > prueba. Eso si el menu y el contenido te quedarán más separados al hacer
> > esto, pero bueno, también podrías corregirlo con alineación o cambiando
> > paddings o algo...
>
> Una solución mucho más correcta y sencilla es cambiar el comportamiento
> del box-model, osease usar una propiedad CSS3 que te permitirá asignar
> los anchos a los objetos tal y como esperas que sea.
> Osease me explico, el problema es que tu al hacer width:x% estás
> diciéndole al navegador que el contenido del ese objeto debe tener un
> ancho del x% respecto del padre, pero el problema es que la definición
> de ancho para casi todo el mundo y para la W3C es diferente, para la W3C
> el padding y el borde no entran dentro de la definición de ancho del
> objeto, pero... al reflotar los elementos (osea calcular si tienen que
> ir para abajo o no dependiendo si caben en la linea) se calcula si cabe
> el objeto teniendo en cuenta el ancho del contenido del objeto, el
> padding y el borde, por lo tanto en cuanto pones un tamaño al ancho, un
> padding y un borde con porcentajes hay tamaños a los cuales el ancho
> total del objeto es superior al espacio disponible y salta para abajo.
> Si has probado a ver la página con IE habrás descubierto que se ve bien,
> bueno, esto es porque los de m$ no siguieron el standard y consideraron
> el ancho como lo lógico (tamaño del contenido del elemento + padding +
> borde)... pero... tenemos una solución, la solución es usar una
> propiedad de las CSS3 que nos permite cambiar el modo para usar el
> modelo lógico y voilá, te funcionará perfectamente :
>
> #contenedor, #encabezado, #menu, #contenido, #footer {
>        -moz-box-sizing:border-box;
>        box-sizing:border-box;
> }
>
> Si quieres una explicación con dibujitos donde se vea más claro como va
> el tema te aconsejo que eches un vistazo a esta página :
>
> http://www.quirksmode.org/css/box.html
>
> Un saludete!
>
> JonAn.
>
>
> _______________________________________________
> eside-ghost mailing list
> eside-ghost en deusto.es
> https://listas.deusto.es/mailman/listinfo/eside-ghost
>



-- 
Saúl -- "Some people say why, other just say, why not."
----------------------------------------------------------------
NUEVA WEB --> http://www.saghul.net/
------------ próxima parte ------------
Se ha borrado un adjunto en formato HTML...
URL: https://listas.deusto.es/mailman/private/eside-ghost/attachments/20070428/07336c6b/attachment.htm