¿Puede el relleno / margen en los botones de radio en IE6 / IE7 reducirse a 0-1px?

StackOverflow https://stackoverflow.com/questions/988460

Pregunta

En Firefox e IE8 esto no es un problema, pero en IE6, IE7 y me parece que no puede reducir el relleno / margen en los botones de radio para nada razonable (por ejemplo 0px o 1px).

En las imágenes incluidas, se puede ver que el fondo rojo es enorme en IE6 / IE7 (incluso con el relleno y el margen CSS tanto ajustado a 0px) todavía en Firefox / Internet Explorer 8 está bien.

La razón, por supuesto, es que el árbol estoy renderizado se ve horrible con las lagunas en IE6 / IE7.

IE6 / IE7

texto alternativo http://img190.imageshack.us/img190/9985/ie7l .png

Firefox / IE8

texto alternativo http://img23.imageshack.us/img23/3411/ie8k .png

Notas: la página se ejecuta en modo estándar, y el rojo es sólo para ilustración

.

Algunos ejemplos de código (para aquellos que quieren introducirse en ella) 

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>IE Radio button padding hell</title>
<style>
  input{
    background-color:red;
    border:0px;
    margin:0px;
    padding:0px;
  }
</style>
</head>
<body>
  <form name="asdf">
    <input type="radio" name="sdfgsd" value=""/>asdf<br/>
    <input type="radio" name="sdfgsd" value=""/>asdf<br/>
    <input type="radio" name="sdfgsd" value=""/>asdf<br/>
    <input type="radio" name="sdfgsd" value=""/>asdf<br/>
  </form>
</body>
</html>
¿Fue útil?

Solución

Uso altura para resolver este problema.

Estoy usando esto en la clase en la entrada: 

.radiobtn
{
border:0px;
height:14px;
}

en 

<input type="radio" class="radiobtn" name="radio"  value=""/> Yes

Se trabajará muy bien en I.E 6,0 / 7.

Otros consejos

Me encontré con este problema y fue capaz de solucionarlo haciendo flotar el elemento de entrada. Eso elimina la pequeña 'margen' vertical en IE6 / IE7.

Añadir overflow:visible así como la altura y la anchura de deshacerse de todo el relleno / margen en IE6 / 7

  

La razón, por supuesto, es que el árbol estoy renderizado se ve horrible con las lagunas en IE6 / IE7.

supongo que está utilizando un archivo de imagen para representar los puntos y las cosas positivas ... tal vez, para evitar esos vacíos cuando las líneas son más altos, se puede usar una imagen más alto.

Sin ver el código Creo que su ejecución en este "bug IE heredó margen: elementos de formulario y hasLayout"

Positioniseverything.net tiene una buena escritura en él: http: //www.positioniseverything. net / explorador / inherited_margin.html

Saludos

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top