Resolviendo bug del margen de un elemento input de Internet Explorer
Hoy he tenido que resolver un bug de Internet Explorer en el que un elemento "input" de formulario dejaba siempre un margen a la derecha dentro de una caja.
Mejor explico el problema con una imagen tal como se veía en Internet Explorer:
Su código es el siguiente:
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="es-ES" xml:lang="es-ES"
xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="Content-type"/>
<title>Prueba</title>
<style type="text/css">
body {
font-family:Tahoma,Verdana,Arial,Helvetica,sans-serif;
font-size:1em;
font-weight:normal;
}
.datos {
display:block;
float:left;
margin:0pt 10px 0pt 0pt;
padding:0pt;
text-align:center;
border:1px solid #f00;
background-color: #FF9;
}
input {
display: block;
border:1px solid #0f0;
}
.c_label_data {
text-align:center;
}
</style>
</head>
<body>
<div class="datos" >
<label for="nota">(1):</label>
<input id="nota" class="nota" type="text" value="4,0000"
size="7" name="nota"/>
</div>
</body>
</html>
Tal como se puede comprobar, Internet Explorer deja un margen a la derecha del elemento "input". Éste margen no se especifica en ningún sitio ni aparece en otros navegadores como Firefox.
La forma que encontré para solucionarlo es englobando el elemento "input" en un elemento "span" de esta forma:
size="7" name="nota"/></span>
Este error lo he podido solucionar a base de muchas pruebas y gracias a la ayuda de la página IE inherited margin bug: form elements and hasLayout de PositionIsEverything.
k_nelita dijo
Hola, mira encontré tu página de casualidad, y me gustaría preguntarte, ya que hablas tan bien del Firefox, yo lo he instalado hace muy poco, porque mi IE6 no daba para más, totalmente lleno de bichos.
Estoy recontenta con el Firefox, aunque ahora se le han empezado a colar algunos elementos emergentes, pero lo peor es que en hotmail, no me aparece la barra de herramientas en el editor, y no puedo encontrarla por ningún lado, salen dentro del editor todos los html que corresponden a la barra, que tengo que borrarlos para poder escribir. Si sabes algún modo de solucionar esto te agradecería.
Otra cosa como verás mi blog es de Blogger, y quería ponerle el truco de Leer más... que existe para Blogger, lo he visto en algunas páginas de Hack pero no entiendo algunas cosas, sabes algo al respecto?
Muchas gracias desde ya, si quieres contestarme a mi correo por si es muy larga la explicación es: knelitak@hotmail.com
Un saludo y por cierto muy bueno tu blog!!
4 Enero 2007 | 02:34 PM