Ok, I solved.. I just needed to add the code:
vertical-align: middle;
to both span styles.
Frage
I have some form with radio and checkboxes.
It should to be like this:
The CSS:
.span-al-top
{
position:relative;
top:-7px;
}
.span-al-bottom
{
position:relative;
top:2px;
}
HTML:
<label>Radio</label>
<br />
<input type="radio" name="radio" value="uno" class="radio-margin"><span class="span-al-bottom">uno</span>
<input type="radio" name="radio" value="due" class="radio-margin"><span class="span-al-bottom">due</span>
<input type="radio" name="radio" value="tres" class="radio-margin"><span class="span-al-bottom">tres</span>
<br />
<label>Checkbox</label>
<br />
<input type="checkbox" name="vehicle" value="Bike" class="checkbox-margin"><span class="span-al-top">one</span>
<input type="checkbox" name="vehicle" value="Bike" class="checkbox-margin"><span class="span-al-top">two</span>
<input type="checkbox" name="vehicle" value="Bike" class="checkbox-margin"><span class="span-al-top">three</span><br />
<input type="checkbox" name="vehicle" value="Bike" class="checkbox-margin"><span class="span-al-top">four</span>
<input type="checkbox" name="vehicle" value="Bike" class="checkbox-margin"><span class="span-al-top">five</span>
<input type="checkbox" name="vehicle" value="Bike" class="checkbox-margin"><span class="span-al-top">six</span>
It works, but it doesn't work with Internet Explorer 6. In Explorer 6 I have this:
Any idea how I fix it?
Lösung
Ok, I solved.. I just needed to add the code:
vertical-align: middle;
to both span styles.