Retroceder   Foros del Web > Diseño de Sitios web > CSS
Crea un nuevo usuario o inicia sesión utilizando tu cuenta de Facebook
Connect with Facebook

Respuesta
 
Herramientas Desplegado
Antiguo 09-ene-2009, 03:30   #1 (permalink)
informa ha deshabilitado el karma
 
Fecha de Ingreso: noviembre-2005
Mensajes: 73
informa está desconectado
Problemas de centrado y height

Soy navatillo en lo del CSS, pero he comprobado que tiene algunos defectos por resolver en la compatibilidad de los diversos navegadores.
El mayor problema que he visto es con el centrado, tanto de texto, como de imagenes, como de tablas o divs. En IE funciona sin problemas, pero en Firefox no centra nada.
El centrado de divs solo funciona con margin:0 auto; y en cuanto pones un margin-top o margin-left diferente ya no hay nada que hacer.
Otro defecto que veo es con el height. En las tablas funciona de maravilla con cualquier navegador, pero no sucede lo mismo con el CSS. Sin embargo el width va de maravilla.
¿Cómo os arreglais para solucionar estos problemas?
  Responder Citando
Antiguo 09-ene-2009, 04:19   #2 (permalink)
Colaborador
Mikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra Lassie
 
Avatar de Mikmoro
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 6.790
Mikmoro esta en línea ahora
Respuesta: Problemas de centrado y height

Cita:
Iniciado por informa Ver Mensaje
Soy navatillo en lo del CSS, pero he comprobado que tiene algunos defectos por resolver en la compatibilidad de los diversos navegadores.
Exactamente al contrario, es decir, son los navegadores los que tienen defectos y problemas a la hora de interpretar CSS. Son ellos los que deben ser compatibles con CSS, no al contrario.

Cita:
Iniciado por informa Ver Mensaje
el mayor problema que he visto es con el centrado, tanto de texto, como de imagenes, como de tablas o divs. En IE funciona sin problemas, pero en Firefox no centra nada.
Iba a contestar a cada uno de los puntos, pero creo que debes leer un poco más antes de emitir semejantes juicios. No afirmes nada de lo que no estés completamente seguro. Has entendido algunas cosas exactamente al revés.

Si tienes alguna duda concreta plantéala y seguro que alguien se preta a ayudarte y explicarte.
__________________
Sabes que te estás haciendo mayor cuando empiezas a comprender que el abuelo sabe mucho.
Mikel.

Última edición por Mikmoro; 09-ene-2009 a las 09:51
  Responder Citando
Antiguo 09-ene-2009, 11:17   #3 (permalink)
CaLiZzZ merece que le prestes tu nueva macbookCaLiZzZ merece que le prestes tu nueva macbookCaLiZzZ merece que le prestes tu nueva macbookCaLiZzZ merece que le prestes tu nueva macbookCaLiZzZ merece que le prestes tu nueva macbookCaLiZzZ merece que le prestes tu nueva macbook
 
Avatar de CaLiZzZ
 
Fecha de Ingreso: octubre-2008
Ubicación: Calizman City
Mensajes: 860
CaLiZzZ está desconectado
Respuesta: Problemas de centrado y height

Yo si me tomare el tiempo de contestar cada uno de los puntos, ya que la incompatibilidad es uno de mis temas favoritos! y mas cuando el afectado es mi Fiel y Confiable amigo FireFox!
Cita:
Soy navatillo en lo del CSS, pero he comprobado que tiene algunos defectos por resolver en la compatibilidad de los diversos navegadores.
El mayor problema que he visto es con el centrado, tanto de texto, como de imagenes, como de tablas o divs. En IE funciona sin problemas, pero en Firefox no centra nada.
Estoy totalmente deacuerdo con Mik cuando dice que no saques jucios adelantados sin antes de estar completamente seguro de que tu jucio es veridico! te invitaria a que diseñaras una pagina solo para FireFox y que luego la vieras en IE e hicieras una para IE y la vieras en FF, te daras cuenta que no solo ese es el problema, sino que la realidad es que IE tiene tantos errores para entender el CSS que nos complica la vida a todos... y aunque FF no es ningun santo, es mucho mas facil hacer paginas para FF que para IE (sino porque crees que hay tantos hacks para IE 6 y 7, y hay menos para FF?)

Cita:
El centrado de divs solo funciona con margin:0 auto; y en cuanto pones un margin-top o margin-left diferente ya no hay nada que hacer.
El centrado de los divs no solo funciona con eso, tambien funciona con otras herramientas como el tan usado text-align: center y un margin: auto al div que quieres centrar... pero esto no es malo! para nada... es mucho mejor, ya que creo que es la forma correcta de centrar las cosas... es como que digas que lo malo del CSS es que solo con text-align: center; puedes centrar los textos! realmente no es que sea malo.. o que sea problematico, sino que es lo correcto!

Cita:
Otro defecto que veo es con el height. En las tablas funciona de maravilla con cualquier navegador, pero no sucede lo mismo con el CSS. Sin embargo el width va de maravilla.
Te sorprenderias de la cantidad de problemas que tiene width... pero son problemas que pasan... como programador CSS tienes que estar abierto a nuevas ideas y ser creativo con tus soluciones... Realmente te invito a hacer una pagina solo para FF y veras que de problemas tendras...

¿Cómo os arreglais para solucionar estos problemas?

Preguntamos en Este Foro! o nos pasamos toda una semana entera agotando recursos...

Espero haber ayudado en el tema! y espero que te queden claros cada uno de los puntos!
Saludos! y Suerte!!

PD: Espero el Link de tu pagina eh! =D
__________________
Visita mi Web Personal
"una lucha exitosa, es una libertad temporal, debemos seguir luchando para seguir siendo libres" Richard Stallman
  Responder Citando
Antiguo 12-ene-2009, 03:56   #4 (permalink)
informa ha deshabilitado el karma
 
Fecha de Ingreso: noviembre-2005
Mensajes: 73
informa está desconectado
Respuesta: Problemas de centrado y height

En primer lugar, peron por las prisas. Ello me llevó a poner los datos al revés: eS cierto que el que falla es IE.

Pero el problema del centrado lo sigo teniendo igual. Esta claro que una gran número de internautas siguen usando IE (por desgracia). Solo hay que ver las estadisticas de nuestras webs. Luego hay que seguir programando para que esta gente vea aceptablemente el contenido. Ello conlleva el tener que seguir utilizando el <center> de toda la vida.

Os pongo un ejemplo de mi prueba:
<HTML>
<HEAD>
<TITLE>New Document</TITLE>
<style type="text/css">
.centrado {margin:0 auto; width:300px; height:200px; background:#DEDEDE;}
.tabla_centrada {margin:0 auto; padding:10px;}



.centrado1 {margin-top:50px; width:300px; height:200px; background:#BBB;}
.tabla_centrada1 {padding:20px;}
</style>
</HEAD>
<BODY>
<div class="centrado">
Este div deberia estar en el centro, porque tiene margin:0 auto; sin embargo, en IE no se centra
<table class="tabla_centrada"><tr><td bgcolor="FF0000">Tabla que deberia estar centrada<br>sin embargo, en IE no se centra</td></tr></table>
</div>




<div class="centrado1">
Este div deberia estar en el centro, pero no se centra por no tener margin:auto
<table class="tabla_centrada1"><tr><td bgcolor="FF0000">Tabla que deberia estar centrada<br>sin embargo, en IE no se centra</td></tr></table>
</div>
</BODY>
</HTML>
  Responder Citando
Antiguo 12-ene-2009, 04:06   #5 (permalink)
Colaborador
Mikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra Lassie
 
Avatar de Mikmoro
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 6.790
Mikmoro esta en línea ahora
Respuesta: Problemas de centrado y height

Te lo centrará perfectamente tanto en IE como Firefox si en lugar de esto:

Cita:
<HTML>
<HEAD>
<TITLE>New Document</TITLE>
usas un doctype adecuado, por ejemplo:
Cita:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="es-es">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
__________________
Sabes que te estás haciendo mayor cuando empiezas a comprender que el abuelo sabe mucho.
Mikel.
  Responder Citando
Antiguo 12-ene-2009, 06:10   #6 (permalink)
informa ha deshabilitado el karma
 
Fecha de Ingreso: noviembre-2005
Mensajes: 73
informa está desconectado
Respuesta: Problemas de centrado y height


Si tienes razón Mikmoro. El primer ejemplo si. pero el segundo no.
¿Cómo hay que hacer para cuando tenemos que usar otro margin? ¿Se pone un nuevo div en balnco que haga las veces del margin?
  Responder Citando
Antiguo 12-ene-2009, 06:29   #7 (permalink)
Colaborador
Mikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra Lassie
 
Avatar de Mikmoro
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 6.790
Mikmoro esta en línea ahora
Respuesta: Problemas de centrado y height

Perdona pero no entiendo a qué te refieres con el primer o segundo ejemplo, ni con lo de otro margin.
__________________
Sabes que te estás haciendo mayor cuando empiezas a comprender que el abuelo sabe mucho.
Mikel.
  Responder Citando
Antiguo 12-ene-2009, 08:27   #8 (permalink)
nigeriano10 ha deshabilitado el karma
 
Fecha de Ingreso: enero-2009
Mensajes: 5
nigeriano10 está desconectado
Respuesta: Problemas de centrado y height

Informa...

Mira yo he tenido el problema del centrado en firefox y explorer y una vez encontré una buena solución.

Esta solución consiste en definir dentro del CSS el body normal y a continuación un body adicional con el centrado para Firefox.

body{
text-align: center;
}
body{
text-align: -moz-center;
}

Ojalá te sirva...
  Responder Citando
Antiguo 12-ene-2009, 19:21   #9 (permalink)
CaLiZzZ merece que le prestes tu nueva macbookCaLiZzZ merece que le prestes tu nueva macbookCaLiZzZ merece que le prestes tu nueva macbookCaLiZzZ merece que le prestes tu nueva macbookCaLiZzZ merece que le prestes tu nueva macbookCaLiZzZ merece que le prestes tu nueva macbook
 
Avatar de CaLiZzZ
 
Fecha de Ingreso: octubre-2008
Ubicación: Calizman City
Mensajes: 860
CaLiZzZ está desconectado
Respuesta: Problemas de centrado y height

Noooo!!! nigeriano10!! eso solo lo centrara en FF!

lo primero esta bien, la propiedad del Body! pero con la unica diferencia que a los divs que estan debajo de el body le pones margin: 0 auto; y listo! tienes tus divs centrados!

Las preguntas de informa no las entendi, al igual que Mik. Explicate mejor y con gusto te ayudamoes!
__________________
Visita mi Web Personal
"una lucha exitosa, es una libertad temporal, debemos seguir luchando para seguir siendo libres" Richard Stallman
  Responder Citando
Antiguo 13-ene-2009, 02:10   #10 (permalink)
informa ha deshabilitado el karma
 
Fecha de Ingreso: noviembre-2005
Mensajes: 73
informa está desconectado
Respuesta: Problemas de centrado y height

La pregunta sobre cómo centrar el div se refiere al <div class="tabla_centrada1">.
Como el class="centrado1" tiene un margin distinto a auto, ya no hay forma de que se centre. Mi solución apuntaba a seguir dejando el <div class="centrado1"> con margin:0 auto; y hacer una chapucilla que equivalga a ese margin mediante un nuevo div que tenga height:50px. Es simplemente una sugerencia. No me gusta nada esta solución, pero es que no se me ocurre otra si no quiero volver al <center>:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="es-es">
<HEAD>
<TITLE>New Document</TITLE>
<style type="text/css">
.separador_para_suplir_el_margin { margin-top:50px;}
.centrado {margin:0 auto; width:300px; height:200px; background:#DEDEDE;}
.tabla_centrada {margin:0 auto; padding:10px;}
</style>
</HEAD>
<BODY>
<div class="separador_para_suplir_el_margin"><div>
<div class="centrado">
Este div se centra, por tener margin:auto
<table class="tabla_centrada"><tr><td bgcolor="FF0000">Tabla que debe estar centrada</td></tr></table>
</div>
</BODY>
</HTML>
  Responder Citando
Antiguo 13-ene-2009, 02:14   #11 (permalink)
Colaborador
Mikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra Lassie
 
Avatar de Mikmoro
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 6.790
Mikmoro esta en línea ahora
Respuesta: Problemas de centrado y height

Pues lo siento pero aun lo entiendo menos. ¿Estás hablando de centrado horizontal o vertical?
__________________
Sabes que te estás haciendo mayor cuando empiezas a comprender que el abuelo sabe mucho.
Mikel.
  Responder Citando
Antiguo 14-ene-2009, 02:42   #12 (permalink)
informa ha deshabilitado el karma
 
Fecha de Ingreso: noviembre-2005
Mensajes: 73
informa está desconectado
Respuesta: Problemas de centrado y height

El problema que expongo es claramente de centrado horizontal de los div.
Aqui tienes el ejemplo. Este div tendría que estar centrado, pero no se centra porque por exigencias de la programación tiene que tener un margen superior determinado. Al no poder tener margin:0 auto; ¿cómo lo centramos horizontalmente?:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="es-es">
<HEAD>
<TITLE>New Document</TITLE>
<style type="text/css">
.contenedor {margin:50px; width:400px; height:200px; background:#DEDEDE;}
.tabla_centrada {margin:0 auto; padding:10px;}
</style>
</HEAD>
<BODY>
<div class="contenedor">Este div NO se centra, porque no tiene margin:0 auto; <br> ya que necesita tener un margen superior: 50px</div>
</BODY>
</HTML>
  Responder Citando
Antiguo 14-ene-2009, 02:49   #13 (permalink)
Colaborador
Mikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra Lassie
 
Avatar de Mikmoro
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 6.790
Mikmoro esta en línea ahora
Respuesta: Problemas de centrado y height

Cita:
Iniciado por informa Ver Mensaje
El problema que expongo es claramente de centrado horizontal de los div.
Aqui tienes el ejemplo. Este div tendría que estar centrado, pero no se centra porque por exigencias de la programación tiene que tener un margen superior determinado. Al no poder tener margin:0 auto; ¿cómo lo centramos horizontalmente?:
Pero veamos: el margen superior no afecta para nada al centrado horizontal, es decir, que si tú pones:
margin: 50px auto;
la caja se centra horizontalmente igual.

Lo que me ha desconcertado es que incluyeras:
<div class="separador_para_suplir_el_margin"><div>
para intentar engañarlo para el centrado horizontal.

En resumen, los márgenes superior e inferior no afectan al centrado horizontal (izquierda y derecha).
__________________
Sabes que te estás haciendo mayor cuando empiezas a comprender que el abuelo sabe mucho.
Mikel.
  Responder Citando
Antiguo 14-ene-2009, 02:51   #14 (permalink)
Colaborador
Mikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra Lassie
 
Avatar de Mikmoro
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 6.790
Mikmoro esta en línea ahora
Respuesta: Problemas de centrado y height

Incluso si quieres que sólo tenga margen superior, puedes poner:

margin: 50px auto 0 auto;

y se centrará.
__________________
Sabes que te estás haciendo mayor cuando empiezas a comprender que el abuelo sabe mucho.
Mikel.
  Responder Citando
Antiguo 15-ene-2009, 02:30   #15 (permalink)
informa ha deshabilitado el karma
 
Fecha de Ingreso: noviembre-2005
Mensajes: 73
informa está desconectado
Respuesta: Problemas de centrado y height

Gracias Mikmoro: La solución está en margin: 50px auto 0 auto;

No sabia esta formula. Funciona perfectamente.

Saludos.
  Responder Citando
Antiguo 15-ene-2009, 02:46   #16 (permalink)
Colaborador
Mikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra LassieMikmoro es mas bueno que la perra Lassie
 
Avatar de Mikmoro
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 6.790
Mikmoro esta en línea ahora
Respuesta: Problemas de centrado y height

Me alegro. Para otra vez, no hay como formular la consulta correcta y precisa para recibir la ayuda más adecuada.

Saludos.
__________________
Sabes que te estás haciendo mayor cuando empiezas a comprender que el abuelo sabe mucho.
Mikel.
  Responder Citando
Respuesta
No hay votos aún.

Herramientas
Desplegado

Normas de Publicación
No puedes crear nuevos temas
No puedes responder temas
No puedes subir archivos adjuntos
No puedes editar tus mensajes

BB code está Activado
Caritas están Activado
[IMG] está Activado
Código HTML está Desactivado
Trackbacks está Desactivado
Pingbacks está Desactivado
Refbacks está Desactivado



La zona horaria es GMT -6. Ahora son las 15:53.
Políticas de Uso de Foros del Web


Message Board Statistics

SEO by vBSEO 3.3.0

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100