No replies
Last seen: 12 years 2 days ago
Timezone: GMT-4
Joined: 2009-01-23
Posts: 27
Points: 1


I'm having a problem in FF with labels for radio buttons. The labels are dropping down another line. I've used floats throughout my css to help line things up, but I can't figure out how why these techniques are not working here.

I have a simple example below. Any help is appreciated.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
<html xmlns="" xml:lang="en" lang="en">
<style type="text/css">
list-style-type: none;
.form_input ul.radio_list {
	float: left;
	width: 70%;
.form_row .form_input label {
	float: left;
	width: 60%;
	margin: 0;;
	text-align: left;
.form_input ul.radio_list li {
	float: left;
	width: 100%;
.form_input ul.radio_list li input {
	float: left;
	width: 1em;
	margin: 0;
	padding: 0;
.form_input ul.radio_list li label {
	clear: none;
	float: left;
	width: 10em;
	margin: 0 0 0 2em;
	padding: 0 0 0 0;
	margin: 0 0 0 4em;
	margin-right: 0;
	text-align: left;
<form method="post" id="register_form" action="/submit-registration.html"> 
<div class="form_row">
<div class="form_input">
<label for="user_consumer_is_user_agreement">Please select whether you accept the terms above<sup class="required_item">*</sup></label>
<ul class="radio_list">
    <input name="user[consumer][is_user_agreement]" type="radio" value="0" id="user_consumer_is_user_agreement_0" checked="checked" />&nbsp;
	<label for="user_consumer_is_user_agreement_0">I do not accept</label>
    <input name="user[consumer][is_user_agreement]" type="radio" value="1" id="user_consumer_is_user_agreement_1" />&nbsp;
	<label for="user_consumer_is_user_agreement_1">I accept</label>