Foros del Web » Creando para Internet » CSS »

Problemas al centrar capa en mozilla

Estas en el tema de Problemas al centrar capa en mozilla en el foro de CSS en Foros del Web. Buenas tengo una capa que contiene un flash con el siguiente código: <div id="botonera" style="position:absolute; margin: auto;top:82px; width:914px; height:205px; z-index:1"> El problema esta en que ...
  #1 (permalink)  
Antiguo 06/10/2009, 12:26
Avatar de sealen  
Fecha de Ingreso: mayo-2008
Mensajes: 34
Antigüedad: 9 años, 6 meses
Puntos: 0
Problemas al centrar capa en mozilla

Buenas tengo una capa que contiene un flash con el siguiente código:

<div id="botonera" style="position:absolute; margin: auto;top:82px; width:914px; height:205px; z-index:1">

El problema esta en que se me justifica al centro en IE pero en mozilla lo lanza a la parte izquierda de la pantalla, mi pregunta es la siguiente.

¿que codigo añado para justificar al centro dicha capa en mozilla?

Muchas gracias de antemano
  #2 (permalink)  
Antiguo 06/10/2009, 20:11
 
Fecha de Ingreso: diciembre-2008
Ubicación: Mi Casa =D
Mensajes: 292
Antigüedad: 9 años
Puntos: 5
Respuesta: Problemas al centrar capa en mozilla

Prueba introduciendo esa capa con posición absoluta, dentro de otra capa relativa que tenga margenes automáticos.

#todo {
position:relative;
width:anchodetuweb;
height:altodetuweb;
margin-left:auto;
margin-right:auto;
}

y el html sería asi

<div id="todo">
<div id="botonera" style="position:absolute; margin: auto;top:82px; width:914px; height:205px; z-index:1">
</div>

Espero que te funcione =D

Hasta Luego

Por cierto... este tipo de problemas es muy común con las capas o "divs absolutos".. te sugiero que uses tablas, o que desde un inicio, hagas la capa con posición relativa...

Me voy, good luck =D
  #3 (permalink)  
Antiguo 06/10/2009, 21:14
Avatar de deirdre  
Fecha de Ingreso: mayo-2009
Mensajes: 690
Antigüedad: 8 años, 6 meses
Puntos: 44
Respuesta: Problemas al centrar capa en mozilla

No utilices tablas para algo tan sencillo. Y mejor sacar el estilo fuera de línea. Prueba esto (funciona en todos los navegadores):

Código HTML:
<!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">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Centrar capa en el ancho</title>
<style type="text/css">
#botonera {
	margin: 82px auto; 
	width: 914px; 
	height: 205px; 
	z-index: 1; 
	border: 1px solid #444; /*el borde es sólo para testar*/
}
</style>
</head>

<body>
	<div id="botonera"></div>
</body>

</html> 
Bye
  #4 (permalink)  
Antiguo 08/10/2009, 12:09
Avatar de sealen  
Fecha de Ingreso: mayo-2008
Mensajes: 34
Antigüedad: 9 años, 6 meses
Puntos: 0
Respuesta: Problemas al centrar capa en mozilla

Lo primero muchas gracias por las respuesta, tengo que reconocer que soy un poco necio en el mundo del código y a pesar de vuestras explicaciones no he conseguido hacer correctamente. Os pongo a continuación el código completo de la capa para ver si me podeís ayudar.

<div id="botonera" style="position:absolute; margin: auto;top:82px; width:914px; height:205px; z-index:1">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="914" height="250">
<param name="movie" value="flash/botonera2.swf">
<param name=quality value=high>
<param name="wmode" value="transparent">
<embed src="flash/botonera2.swf" width="914" height="250" quality=high pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" wmode="transparent"></embed>
</object>
</div>


Como referencia tengo subid la web a una URL de prueba para que podaís ver el fallo que me dá exactamente.

http://www.mediaesfera.es/mmp_website

Lamento mucho ser tan poco ducho en estos temas. Mil gracias de nuevo.
  #5 (permalink)  
Antiguo 08/10/2009, 12:37
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Problemas al centrar capa en mozilla

Tienes un problema de concepción y símplemente sufres el riesgo del abuso de la posición absoluta para alterar el flujo.
Cita:
element.style {
height:205px;
margin-bottom:auto;
margin-left:auto;
margin-right:auto;
margin-top:auto;
position:absolute;
top:82px;
width:914px;

z-index:1;
}
y de estructura en el html:
aparece antes tu menú que el resto de los elementos (tablas).
Coloca primero en el html la tabla con el header y a continuación el menú, con psosición relativa, margin: 0 auto 15px. Los 15 px son aproximados.

Un saludo.

P.D.: esta consulta no debería estar en css, pues no hay tal en tu documento.
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
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 22:49.