@@Tolwin:
<span><input type="radio" name="button" value="button1" id="1" /></span>
Fehlerhafter Wert für das 'id'-Attribut. [http://de.selfhtml.org/html/referenz/attribute.htm#id_idref_name]
<span><label>Text Text Text</label></span>
Da fehlt das 'for'=Attribut. Mit einem solchen wird „beim Klick auf den Inhalt eines Labels […] in aktuellen Browsern das Formularelement fokussiert bzw. ausgewählt, auf das sich das Label bezieht. Diese Funktion erleichtert unter anderem die Auswahl von Checkboxen.“ [http://de.selfhtml.org/html/formulare/strukturieren.htm#label] Wichtig für Usability und Barrierefreiheit.
und im CSS so :
.radio input { display:block; float:left; margin:2px 6px 0px 5px !important; margin:-2px 0px 0px 1px; }
.radio label { display:block; margin-left:0px; }
In deinem gezeigten HTML-Quellcode gibt es keine Elemente der Klasse "radio".
Dein Vorhaben ist wohl am besten mit einer Tabelle* zu erreichen:
<table>
<tbody>
<tr>
<td><input type="radio" name="button" value="button1" id="button1" /></td>
<td><label for="button1">Text Text Text</label></td>
</tr>
</tbody>
</table>
Ohne weiteres Zutun stellen wohl alle Browser von Haus aus den Inhalt von Tabellenzellen vertikal mittig dar; Nachhelfen mit 'vertical-align' ist möglich.
Live long and prosper,
Gunnar
* Ob die Zuordnung von Radiobuttons und Labels zu Tabellenspalten und damit die Verwendung einer Tabelle semantisch korrekt ist, darüber darf gestritten werden.
„Das Internet ist ein großer Misthaufen, in dem man allerdings auch kleine Schätze und Perlen finden kann.“ (Joseph Weizenbaum)