Foros del Web » Creando para Internet » CSS »

Margin: auto (increíble pero cierto)

Estas en el tema de Margin: auto (increíble pero cierto) en el foro de CSS en Foros del Web. Compañeros, yo nuevamente con este tema, ya hemos hablado sobre lo del margin: auto; que se supone que en IE funciona correctamente. En este momento ...
  #1 (permalink)  
Antiguo 07/06/2011, 13:53
 
Fecha de Ingreso: junio-2010
Mensajes: 142
Antigüedad: 6 años, 8 meses
Puntos: 5
Margin: auto (increíble pero cierto)

Compañeros, yo nuevamente con este tema, ya hemos hablado sobre lo del margin: auto; que se supone que en IE funciona correctamente.

En este momento les voy a pegar TODO el poco código que tengo que me esta funcionando mal (no centra).

La única manera que puedo lograr centrar en IE es con text align.
HTML:
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>	
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />	
	<?=getTitle()?>
	<?=getTag('description')?>
	<?=getTag('basehref')?>
	<?=getMonitorHeader()?>
	
	<style type="text/css" media="all">@import "<?=$tpl_path?>/css/estilos.css";</style>
	<style type="text/css" media="all">@import "<?=$tpl_path?>/css/estilos_slide.css";</style>	
	<script type="text/javascript" src="<?=$tpl_path?>/js/script.js"></script>
	<script src="<?=$tpl_path?>/js/s3Slider.js" type="text/javascript"></script>
	<link  href="<?=$tpl_path?>/font/century_gothic.ttf" rel="stylesheet" type="text/css" />
	<script type="text/javascript">
		$(document).ready(function() { 
		$('#s3slider').s3Slider({ 
		  timeOut: 4000 
		});
		});
	</script>
	<script type="text/javascript" src="<?=$tpl_path?>/js/carousel.js"></script>
<!--SCRIPT CARUSEL-->
	<script type="text/javascript">
		stepcarousel.setup({
		galleryid: 'carousel', //ID del div que contiene el carrusel
		beltclass: 'belt', //Clase del primer div dentro del carrusel, que contiene al resto de divs
		panelclass: 'panel', //Clase de cada panel individual
		autostep: {enable:true, moveby:1, pause:3000},
		panelbehavior: {speed:1000, wraparound:true, persist:true},
		statusvars: ['statusA', 'statusB', 'statusC'], //register 3 variables that contain current panel (start), current panel (last), and total panels
		contenttype: ['external'] //content setting ['inline'] or ['external', 'path_to_external_file']
		})
	</script>
</head>
<body>
<div id="contenedor_total">
	
	<div id="cont_main_head">
		<div id="main_head"></div>
	</div>
	
	<div id="cont_head">
		<div id="head"></div>
	</div>
	
	<div id="cont_medio">
		<div id="medio"></div>
	</div>
	
	<div id="cont_contenido">
		<div id="contenido"></div>
	</div>
	
	<div id="cont_foot">
		<div id="foot"></div>
	</div>
	
</div>
</body>
</html> 
bien, ahora el CSS:
Código HTML:
*
{
	margin: 0px;
	padding: 0px;
}
body
{
	
}
#contenedor_total
{
	
}


#cont_main_head
{
	display: block;
	height: 40px;
	border-bottom: solid 1px #333;
}
	#cont_main_head #main_head
{
	margin: auto;
	text-align: left;
	width: 990px;
	height: 100%;
	background: ${navigation_bg};
}




#cont_head
{
	display: block;
	height: 120px;
	border-top: solid 1px #ccc;
	border-bottom: solid 1px #333;
	background: ${navigation_bg};
}
	#cont_head #head
{
	margin: auto;
	text-align: left;
	width: 990px;
	height: 100%;
}



#cont_medio
{
	display: block;
	height: 120px;
	border-top: solid 1px #ccc;
	border-bottom: solid 1px #333;
	background: ${second_bg};
}
	#cont_medio #medio
{
	margin: auto;
	text-align: left;
	width: 990px;
	height: 100%;
}
leerlo bien porque esto no puede estar pasando (a veces me funciona otras veces no) y la programación en general no funciona de esa manera.

Abraso!
  #2 (permalink)  
Antiguo 07/06/2011, 14:09
Avatar de alexk
Colaborador
 
Fecha de Ingreso: julio-2009
Ubicación: De vuelta al trono
Mensajes: 1.697
Antigüedad: 7 años, 8 meses
Puntos: 137
Respuesta: Margin: auto (increíble pero cierto)

se perdio el <html>
----
Se me olvidaba antes de cada consulta es mejor validar HTML/CSS y cuando hablamos de IE... mensionar la version en cuestion chao

Última edición por alexk; 07/06/2011 a las 14:10 Razón: se me olvidaba....
  #3 (permalink)  
Antiguo 07/06/2011, 14:28
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 9 años, 8 meses
Puntos: 1567
Respuesta: Margin: auto (increíble pero cierto)

No voy a analizar el código que pusiste, ya que ni siquiera es un html generado,
El valor auto para la propiedad margin funciona perfectamente (en IE a partir de la versión 7) en todos los navegadores

Ejemplo

Código HTML:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es" >
  4. <title>Centrar con Auto</title>
  5. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  6. <style type="text/css">
  7.  
  8. .centrada {
  9. margin: 10px auto;
  10. }
  11.  
  12. div.centrada {
  13. width: 100px;
  14. border: solid #000 1px;
  15. height: 50px;
  16. text-align: center;
  17. }
  18.  
  19. img.centrada {
  20. width: 100px;
  21. display: block;
  22. border: solid #000 1px;
  23. }
  24.  
  25.     </style>
  26. </head>
  27. <div class="centrada">
  28. Div centrada con auto
  29. </div>
  30. <table width="500" border="1" class="centrada">
  31. <tr>
  32. <td>
  33. Tabla centrada con auto
  34. </td>
  35. </tr>
  36. <div>
  37.    
  38. <img src="rojo.gif" width="100" height="100" alt="" class="centrada" />
  39. </div>
  40. <div class="centrada">
  41. imagen centrada con auto
  42. </div>
  43. </body>
  44. </html>


como verás estoy centrando múltiples elementos. tambien use text-align center para que veas como afecta

Te dejo una demo en
http://foros.emprear.com/mostrarcapa..._con_auto.html

Saludos
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #4 (permalink)  
Antiguo 07/06/2011, 14:44
 
Fecha de Ingreso: junio-2010
Mensajes: 142
Antigüedad: 6 años, 8 meses
Puntos: 5
Respuesta: Margin: auto (increíble pero cierto)

Si, ya se, pero por alguna extraña razón no me funciona el margin: auto; (para IE) para el resto si.

no tenia la etiqueta HTML, ya la puse, probé y anda.


Como que no es un código generado?.
  #5 (permalink)  
Antiguo 07/06/2011, 15:39
Avatar de alexk
Colaborador
 
Fecha de Ingreso: julio-2009
Ubicación: De vuelta al trono
Mensajes: 1.697
Antigüedad: 7 años, 8 meses
Puntos: 137
Respuesta: Margin: auto (increíble pero cierto)

Cita:
Iniciado por rossijona Ver Mensaje
Si, ya se, pero por alguna extraña razón no me funciona el margin: auto; (para IE) para el resto si.

no tenia la etiqueta HTML, ya la puse, probé y anda.


Como que no es un código generado?.
Lo importante es que ya funciona... con "código generado" se refiere a lo que el navegador interpreta y no "<?=getTitle()?>" que no tiene nada que ver con HTML/CSS que es lo que se necesita para ayudarte mas fácilmente copiando y pegando para ver lo mismo que tu...

Etiquetas: auto, margin
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 18:24.