Foros del Web » Creando para Internet » CSS »

Validar propiedad /margin css

Estas en el tema de Validar propiedad /margin css en el foro de CSS en Foros del Web. Buenos dias: Como todas las personas que desarrollan webs me encuentro con el problema de las diferentes interpretaciones del css del explorer y el firefox. ...
  #1 (permalink)  
Antiguo 19/02/2008, 02:42
 
Fecha de Ingreso: marzo-2007
Mensajes: 12
Antigüedad: 10 años, 8 meses
Puntos: 0
Validar propiedad /margin css

Buenos dias:

Como todas las personas que desarrollan webs me encuentro con el problema de las diferentes interpretaciones del css del explorer y el firefox. He leido por algun foro que si pones la / delante de una propiedad, solo la interpreta el explorer....y es cierto....pero no me valida el w3c.

Alguna sugerencia? Otra forma de hacerlo? Muchas gracias de antemano.

Saludos y que tengan un buen dia¡
  #2 (permalink)  
Antiguo 19/02/2008, 07:48
Avatar de Raulmmmm  
Fecha de Ingreso: marzo-2007
Ubicación: En otro lugar que tú
Mensajes: 1.549
Antigüedad: 10 años, 8 meses
Puntos: 36
Re: Validar propiedad /margin css

En vez de hacer eso, pon en el HTML:
<!--[if IE>
<style type="text/css">
margin: 0;
</style>
<![endif]-->
  #3 (permalink)  
Antiguo 19/02/2008, 08:35
 
Fecha de Ingreso: marzo-2007
Mensajes: 12
Antigüedad: 10 años, 8 meses
Puntos: 0
Re: Validar propiedad /margin css

Muchas gracias por la respuesta, pero no entiendo lo que quieres decir.

Me podrias poner un ejemplo con el codigo que yo necesitaria? Mi codigo es este:

@charset "utf-8";
/* CSS Document */
* {
margin: 0;
padding: 0;
}
<!--
body {
font: 80% Arial, Helvetica, sans-serif;
/*background:#eaf2cc url(../images/background.png) repeat-x;*/
background-color:#eaeaea;
margin:0;/* es recomendable ajustar a cero el margen y el relleno del elemento body para lograr la compatibilidad con la configuración predeterminada de los diversos navegadores */
padding: 0;
text-align: center; /* esto centra el contenedor en los navegadores IE 5*. El texto se ajusta posteriormente con el valor predeterminado de alineación a la izquierda en el selector #container */
color: #000000;
}

.global #container {
width: 80%; /* esto creará un contenedor con el 80% del ancho del navegador */
background: #ffffff;
margin: 0 auto; /* los márgenes automáticos (conjuntamente con un ancho) centran la página */
text-align: left; /* esto anula text-align: center en el elemento body. */
}


html>body .global #container {
width: 80%; /* esto creará un contenedor con el 80% del ancho del navegador */
background: #ffffff;
margin:0; /* los márgenes automáticos (conjuntamente con un ancho) centran la página */
text-align: left; /* esto anula text-align: center en el elemento body. */
}

.global h1, h2 {
font-family:"Times New Roman", Times, serif;
font-style:italic;
}

.global #header {
background: #666666;
}
.global #header h1 {
margin: 0; /* el ajuste en cero del margen del último elemento del div de #header evita la contracción del margen (un espacio inexplicable entre divs). Si el div tiene un borde alrededor, esto no es necesario, ya que también evita la contracción del margen */
}
.global .barrita {
background: #000;
color:#FFFFFF;
font-size:10px;
overflow:hidden;
padding-top:3px;
padding-bottom:3px;
padding-right:3px;
padding-left:10px;
}
.global #leftcolumn {
width:20%;
float:left;
padding:1%;
text-align:justify;
background-color:#ffffff;
}
.global #mainContent {
width:76%;
float:left;
padding:1%;
text-align:justify;
background-color:#ffffff;
}

/* ARCHIVO CSS PARA EL MENU */

.arrowlistmenu{
/*width: 180px; /*width of accordion menu*/
}

.arrowlistmenu .menuheader{ /*CSS class for menu headers in general (expanding or not!)*/
font:10px Arial;
color:#000000;
background-color:#E2EBC1;
margin-bottom: 5px; /*bottom spacing between header and rest of content*/
text-transform: uppercase;
padding: 4px 0 4px 10px; /*header text is indented 10px*/
/margin-left:10px; /* SOLO PARA IE YA QUE FIREFOX NO INTERPRETA LA BARRA */
cursor:pointer;
}

.arrowlistmenu .openheader{ /*CSS class to apply to expandable header when it's expanded*/
background-color:#C2D57F;
}

.arrowlistmenu .pulsado {
color:#000000;
}

.arrowlistmenu ul{ /*CSS for UL of each sub menu*/
list-style-type:none;
margin: 0;
padding: 0;
/*margin-bottom: 2px; /*bottom spacing between each UL and rest of content*/
}

.arrowlistmenu ul li{
padding-bottom: 8px; /*bottom spacing between menu items*/
}

.arrowlistmenu ul li a{
/margin-left:10px; /* PARA QUE EXPLORER SITUE BIEN LAS IMAGENES DE LA FLECHITA*/
color: #999999;
background: url(../images/flechamenu.png) no-repeat left center; /*custom bullet list image*/
display: block;
padding: 2px 0;
padding-left: 19px; /*link text is indented 19px*/
/padding-left:10px; /* PARA QUE EXPLORER SEPARE BIEN EL TEXTO DE LAS FLECHITAS */
text-decoration: none;
border-bottom: 1px dashed #dadada;
font-size: 85%;
}

.arrowlistmenu ul li a:visited{
color: #999999;
}

.arrowlistmenu ul li a:hover{ /*hover state CSS*/
color: #000000;
background-color: #F3F3F3;
}
-->
.pics { height:141px; padding:0; margin:0; overflow: hidden; }
.pics img { height:141px; }

/* MENU DE NAVBAR */

.navbar {
list-style:none;
margin:0;
padding:0;
}
.navbar li {
margin-left:5px;
background: url(../images/flechamenu.png) no-repeat left center; /*custom bullet list image*/
padding-left: 15px; /*link text is indented 19px*/
float:left; //para eliminar el comportamiento de elemento de bloque(salto de linea)
}

Gracias y un saludo
  #4 (permalink)  
Antiguo 19/02/2008, 09:28
 
Fecha de Ingreso: septiembre-2003
Mensajes: 72
Antigüedad: 14 años, 3 meses
Puntos: 3
Re: Validar propiedad /margin css

Pues, los problemas con la validación en W3C no tiene nada que ver con la forma en la que interpreta el IE o FF, más bien cuentame que problema tienes con el aspecto a ver si te hecho una mano...

Además nunca he visto o utilizado este tipo de codigo

Cita:
html>body .global #container {
width: 80%; /* esto creará un contenedor con el 80% del ancho del navegador */
background: #ffffff;
margin:0; /* los márgenes automáticos (conjuntamente con un ancho) centran la página */
text-align: left; /* esto anula text-align: center en el elemento body. */
}
el html>body no se que sea, además:

¿Que error te da el W3C?
__________________
Aplitec

Última edición por patolinec; 19/02/2008 a las 09:32 Razón: Corregir algunas cosas
  #5 (permalink)  
Antiguo 19/02/2008, 11:56
 
Fecha de Ingreso: marzo-2007
Mensajes: 12
Antigüedad: 10 años, 8 meses
Puntos: 0
Re: Validar propiedad /margin css

Los problemas de visualizacion vienen derivados de diferente interpretacion que ambos navegadores hacen de los margenes, por lo que un div se ve diferente en el firefox y en ie con el mismo margen en el css.

Para solucionar eso se puede aplicar la siguiente regla:

margin-top: 20px; PARA FIREFOX
/margin-top: 50px; PARA EXPLORER

Esta barra (/) que se pone delante del atributo, es la que da error.

Muchas gracias.

ciaoooooooooo
  #6 (permalink)  
Antiguo 19/02/2008, 12:36
Avatar de Raulmmmm  
Fecha de Ingreso: marzo-2007
Ubicación: En otro lugar que tú
Mensajes: 1.549
Antigüedad: 10 años, 8 meses
Puntos: 36
Re: Validar propiedad /margin css

Ese CSS lo tienes en una página HTML, ¿no?. Pues es en la página HTML donde tienes que poner el código:
Código HTML:
<!--[if IE>
<style type="text/css">
margin-top: 50px;
</style>
<![endif]--> 
Y borrar la línea del CSS.
  #7 (permalink)  
Antiguo 20/02/2008, 01:06
 
Fecha de Ingreso: marzo-2007
Mensajes: 12
Antigüedad: 10 años, 8 meses
Puntos: 0
Re: Validar propiedad /margin css

Muchas gracias, lo probaré a ver que tal.

Saludos¡¡
  #8 (permalink)  
Antiguo 20/02/2008, 03:20
Avatar de hades87  
Fecha de Ingreso: diciembre-2007
Ubicación: Barcelona - España
Mensajes: 3.194
Antigüedad: 10 años
Puntos: 68
Re: Validar propiedad /margin css

antocs creo que para ie no es una barra / sino que es un guin bajo así _, pero alomejor me confundo.
__________________
No diseñes usando tablas.
  #9 (permalink)  
Antiguo 20/02/2008, 03:50
 
Fecha de Ingreso: marzo-2007
Mensajes: 12
Antigüedad: 10 años, 8 meses
Puntos: 0
Re: Validar propiedad /margin css

Gracias hades87, pero con la forma que me han dicho antes funciona y valida.

Gracias a todos por las respuestas¡

Saludos
  #10 (permalink)  
Antiguo 19/04/2008, 20:53
 
Fecha de Ingreso: abril-2008
Ubicación: Argentina Bs As
Mensajes: 10
Antigüedad: 9 años, 7 meses
Puntos: 0
Re: Validar propiedad /margin css

alguien sabe sobre una propiedad llamada 00 (cero cero) ?
segun vi es para generar un estandar propio en nuestra web y ambos navegadores tomarian los margenes como corresponde (segun nuestra especificacion)
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

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 03:40.