Note that there are some explanatory texts on larger screens.

plurals
  1. POCan the padding/margin on radio buttons in IE6/IE7 be reduced to 0-1px?
    primarykey
    data
    text
    <p>In Firefox and IE8 this isn't a problem, but in IE6, and IE7 I can't seem to reduce the padding/margin on radio buttons to anything reasonable (e.g. 0px or 1px).</p> <p>In the included images, you can see that the red background is huge on IE6/IE7 (even with CSS padding and margin both set to 0px) yet in Firefox/IE8 it is fine.</p> <p>The reason of course is that the tree I'm rendering looks horrible with the gaps in IE6/IE7.</p> <h1>IE6/IE7</h1> <p><a href="http://img190.imageshack.us/img190/9985/ie7l.png" rel="nofollow noreferrer">alt text http://img190.imageshack.us/img190/9985/ie7l.png</a></p> <h1>Firefox/IE8</h1> <p><a href="http://img23.imageshack.us/img23/3411/ie8k.png" rel="nofollow noreferrer">alt text http://img23.imageshack.us/img23/3411/ie8k.png</a></p> <p>Notes: the page runs in standards mode, and the red is just for illustration.</p> <h1>Some sample code (for those that want to hack at it)</h1> <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;IE Radio button padding hell&lt;/title&gt; &lt;style&gt; input{ background-color:red; border:0px; margin:0px; padding:0px; } &lt;/style&gt; &lt;/head&gt; &lt;body&gt; &lt;form name="asdf"&gt; &lt;input type="radio" name="sdfgsd" value=""/&gt;asdf&lt;br/&gt; &lt;input type="radio" name="sdfgsd" value=""/&gt;asdf&lt;br/&gt; &lt;input type="radio" name="sdfgsd" value=""/&gt;asdf&lt;br/&gt; &lt;input type="radio" name="sdfgsd" value=""/&gt;asdf&lt;br/&gt; &lt;/form&gt; &lt;/body&gt; &lt;/html&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload