Comentarios en: Centrado con CSS (2): Vertical http://www.webmasterlibre.com/2006/07/03/centrado-con-css-2-vertical/ Desarrollo Web con Software Libre Tue, 07 Feb 2012 14:38:05 +0000 hourly 1 http://wordpress.org/?v=3.3.1 Por: German http://www.webmasterlibre.com/2006/07/03/centrado-con-css-2-vertical/comment-page-1/#comment-417991 German Fri, 25 Nov 2011 16:38:14 +0000 http://www.webmasterlibre.com/2006/07/03/centrado-con-css-2-vertical/#comment-417991 Hola, pues y lo que cambie fue la position fixed o fija por absoluta y me centro bien y ya me baja el scroll, espero solucione hasta el momento funciona. Hola, pues y lo que cambie fue la position fixed o fija por absoluta y me centro bien y ya me baja el scroll, espero solucione hasta el momento funciona.

]]> Por: z666zz666z http://www.webmasterlibre.com/2006/07/03/centrado-con-css-2-vertical/comment-page-1/#comment-363901 z666zz666z Thu, 22 Sep 2011 09:07:57 +0000 http://www.webmasterlibre.com/2006/07/03/centrado-con-css-2-vertical/#comment-363901 Bastante útil, pero tiene un problema... Si lo que se desea centrar verticalmente es una celda de una especie de tabla hace cosas raras en otras celdas... Cread una tabla de 4x4 de un tamaño el que se desee (75%,66%) o lo que se quiera... Cread dentro de la tabla sus cuatro filas, la tercera que coja el alto restante Cread dentro de la tabla sus cuatro columnas, la tercera que coja el ancho restante De este modo las celdas de las filas 1,2 y 4 no cambian de alto De este modo las celdas de la fila 3 cambian de alto al cambiar el tamaño de la ventana De este modo las celdas de las columnas 1,2 y 4 no cambian de ancho De este modo las celdas de la columnas 3 cambian de ancho al cambiar el tamaño de la ventana Y la celda 3,3 será tan grande como sea necesario Si a la celda 3,3 le metemos un div con display:block;width:100%;height:100%; y a ese div le aplicamos este truco... la leche, las otras celdas de la fila se dañan. La implementación que hacen los navegadores de <div stle="display:table...."> es super chachi... lo que está fuera de esa tabla se puede ver influenciado por cualquier <div stle="...vertical-aling:middle;...."> que esté en cualquier otra celda... Y cómo lo se? Facil... haciendo una trampa... poniendo en todas y cada una de las celdas otro par de divs anidados, uno con display:block y dentro de él otro con display:table... con el border a 2px dotted blue para ver los bordes... vaya chapuza de implementación de los navegadores... Si en height no se usa % sino un valor fijo entonces todo va bien, pero claro entonces el tamaño no cambia al cambiar el tamaño de la ventana, ni se auto ajustan al contenido, etc... De momento no he sido capaz de encontrar solución a este problema y mucho menos una que funcione en todos los navegadores. Si alguien haya alguna que me lo haga saber, por favor... Resumen: Intentad resolver el problema del centrado vertical no en el body directamente sino dentro de un div que simule una celda de una tabla de varias filas y columnas... al alinear verticalmente esa celda las de la misma fila se ven misteriosamente afectadas... y en cada navegador de forma diferente. Bastante útil, pero tiene un problema…

Si lo que se desea centrar verticalmente es una celda de una especie de tabla hace cosas raras en otras celdas…

Cread una tabla de 4×4 de un tamaño el que se desee (75%,66%) o lo que se quiera…
Cread dentro de la tabla sus cuatro filas, la tercera que coja el alto restante
Cread dentro de la tabla sus cuatro columnas, la tercera que coja el ancho restante
De este modo las celdas de las filas 1,2 y 4 no cambian de alto
De este modo las celdas de la fila 3 cambian de alto al cambiar el tamaño de la ventana
De este modo las celdas de las columnas 1,2 y 4 no cambian de ancho
De este modo las celdas de la columnas 3 cambian de ancho al cambiar el tamaño de la ventana
Y la celda 3,3 será tan grande como sea necesario

Si a la celda 3,3 le metemos un div con display:block;width:100%;height:100%; y a ese div le aplicamos este truco… la leche, las otras celdas de la fila se dañan.

La implementación que hacen los navegadores de <div stle=”display:table….”> es super chachi… lo que está fuera de esa tabla se puede ver influenciado por cualquier <div stle=”…vertical-aling:middle;….”> que esté en cualquier otra celda…

Y cómo lo se? Facil… haciendo una trampa… poniendo en todas y cada una de las celdas otro par de divs anidados, uno con display:block y dentro de él otro con display:table… con el border a 2px dotted blue para ver los bordes… vaya chapuza de implementación de los navegadores…

Si en height no se usa % sino un valor fijo entonces todo va bien, pero claro entonces el tamaño no cambia al cambiar el tamaño de la ventana, ni se auto ajustan al contenido, etc…

De momento no he sido capaz de encontrar solución a este problema y mucho menos una que funcione en todos los navegadores.

Si alguien haya alguna que me lo haga saber, por favor…

Resumen: Intentad resolver el problema del centrado vertical no en el body directamente sino dentro de un div que simule una celda de una tabla de varias filas y columnas… al alinear verticalmente esa celda las de la misma fila se ven misteriosamente afectadas… y en cada navegador de forma diferente.

]]> Por: Claudio http://www.webmasterlibre.com/2006/07/03/centrado-con-css-2-vertical/comment-page-1/#comment-353337 Claudio Sat, 27 Aug 2011 23:54:56 +0000 http://www.webmasterlibre.com/2006/07/03/centrado-con-css-2-vertical/#comment-353337 Nunca voy a entender por qué no hicieron una propiedad para centrar verticalmente de una y sin tener que apelar a estos trucos. Por lo visto en CSS3 aún sigue siendo complicado, va no complicado, pero anti natural como sería horizontalmente. Si existe un lugar para hacer quejas al respecto sería bueno que todos lo hagamos con el fin que agreguen ciertas cosas que para los que hacen el código pueden ser obsoletas, pero no son ellos quienes diseñan las páginas... Nunca voy a entender por qué no hicieron una propiedad para centrar verticalmente de una y sin tener que apelar a estos trucos. Por lo visto en CSS3 aún sigue siendo complicado, va no complicado, pero anti natural como sería horizontalmente. Si existe un lugar para hacer quejas al respecto sería bueno que todos lo hagamos con el fin que agreguen ciertas cosas que para los que hacen el código pueden ser obsoletas, pero no son ellos quienes diseñan las páginas…

]]> Por: :) http://www.webmasterlibre.com/2006/07/03/centrado-con-css-2-vertical/comment-page-1/#comment-128888 :) Tue, 15 Sep 2009 17:59:02 +0000 http://www.webmasterlibre.com/2006/07/03/centrado-con-css-2-vertical/#comment-128888 Sergiomas, no has descubierto nada. El ejemplo de este tutorial es para un problema mucho más complejo que el que se resuelve en el enlace que has puesto. Sergiomas, no has descubierto nada.
El ejemplo de este tutorial es para un problema mucho más complejo que el que se resuelve en el enlace que has puesto.

]]> Por: Antione http://www.webmasterlibre.com/2006/07/03/centrado-con-css-2-vertical/comment-page-1/#comment-122552 Antione Tue, 07 Jul 2009 14:17:22 +0000 http://www.webmasterlibre.com/2006/07/03/centrado-con-css-2-vertical/#comment-122552 excelente demostración del trabajo que nos ahorraría saber meter una etiqueta table a tiempo   excelente demostración del trabajo que nos ahorraría saber meter una etiqueta table a tiempo
 

]]> Por: sergiomas http://www.webmasterlibre.com/2006/07/03/centrado-con-css-2-vertical/comment-page-1/#comment-13388 sergiomas Sat, 24 May 2008 19:51:42 +0000 http://www.webmasterlibre.com/2006/07/03/centrado-con-css-2-vertical/#comment-13388 Yo he conseguido mi propio sistema para <a href="http://www.saltarintro.com/wp/2008/05/24/centrar-una-web-vertical-y-horizontalmente-con-css-y-sin-tablas-ni-efectos-secundarios/" rel="nofollow">centrar una web con css</a>, y funciona en IE5.5, 6, 7, y hasta 8beta, Firefox, Opera, Safari, ..., tanto horizontal como vertical y sin que al redimensionar el navegador deje de ser accesible todo el contenido. Echadle un vistazo, a ver que os parece. Yo he conseguido mi propio sistema para centrar una web con css, y funciona en IE5.5, 6, 7, y hasta 8beta, Firefox, Opera, Safari, …, tanto horizontal como vertical y sin que al redimensionar el navegador deje de ser accesible todo el contenido.
Echadle un vistazo, a ver que os parece.

]]> Por: Marco Nuñez G. http://www.webmasterlibre.com/2006/07/03/centrado-con-css-2-vertical/comment-page-1/#comment-8462 Marco Nuñez G. Wed, 05 Mar 2008 00:26:16 +0000 http://www.webmasterlibre.com/2006/07/03/centrado-con-css-2-vertical/#comment-8462 ups no sabes lo que me ha costado realizar que esto funcione bien... pero el problema radica en cuando se exede los limites no se visualiza el contenido que sobre sale... en firefox no funciona bien y rarisimo que en IE si funciona... es extraño pero para eso no se cumple el estandar... ojala los navegadores evolucionen y se puedan leer este tipo de situacion. ups no sabes lo que me ha costado realizar que esto funcione bien… pero el problema radica en cuando se exede los limites no se visualiza el contenido que sobre sale… en firefox no funciona bien y rarisimo que en IE si funciona…
es extraño pero para eso no se cumple el estandar… ojala los navegadores evolucionen y se puedan leer este tipo de situacion.

]]> Por: Mendi http://www.webmasterlibre.com/2006/07/03/centrado-con-css-2-vertical/comment-page-1/#comment-6205 Mendi Thu, 03 Jan 2008 12:38:33 +0000 http://www.webmasterlibre.com/2006/07/03/centrado-con-css-2-vertical/#comment-6205 Muchas gracias Alma. Parece mentira que a estas alturas los navegadores no soporten el centrado vertical normalmente. Si es que al final nos obligan a usar tablas para algunas cosas... Muchas gracias Alma. Parece mentira que a estas alturas los navegadores no soporten el centrado vertical normalmente. Si es que al final nos obligan a usar tablas para algunas cosas…

]]> Por: Alma Fernández http://www.webmasterlibre.com/2006/07/03/centrado-con-css-2-vertical/comment-page-1/#comment-3612 Alma Fernández Tue, 27 Mar 2007 12:34:39 +0000 http://www.webmasterlibre.com/2006/07/03/centrado-con-css-2-vertical/#comment-3612 Habrá que investigar un poco, gracias por el apunte Habrá que investigar un poco, gracias por el apunte

]]> Por: atomik http://www.webmasterlibre.com/2006/07/03/centrado-con-css-2-vertical/comment-page-1/#comment-3610 atomik Tue, 27 Mar 2007 10:29:01 +0000 http://www.webmasterlibre.com/2006/07/03/centrado-con-css-2-vertical/#comment-3610 Estos trucos estan muy bien, pero no funcionan en el Explorer 7. Una manera de solucionarlo es anidando una capa al 50% pero solo es una solución para contenidos pequeños. Estos trucos estan muy bien, pero no funcionan en el Explorer 7. Una manera de solucionarlo es anidando una capa al 50% pero solo es una solución para contenidos pequeños.

]]>