Example liststyling

by Gino Bos

HTML

<div class="wide checkbox-inline">
	<label class="required" for="options[3]">Delivery Day  <em>*</em> </label>
   <br/><br/>
	<div class="input-box">
		<input type="checkbox" name="options[3][]" id="options_3_text_Sunday" class="checkbox" title="Sunday" value="Sunday"><label for="options_3_text_Sunday"> Sunday</label>
		<input type="checkbox" name="options[3][]" id="options_3_text_Monday" class="checkbox" title="Monday" value="Monday"><label for="options_3_text_Monday"> Monday</label>
		<input type="checkbox" name="options[3][]" id="options_3_text_Tuesday" class="checkbox" title="Tuesday" value="Tuesday"><label for="options_3_text_Tuesday"> Tuesday</label>
		<input type="checkbox" name="options[3][]" id="options_3_text_Wednesday" class="checkbox" title="Wednesday" value="Wednesday"><label for="options_3_text_Wednesday"> Wednesday</label>
		<input type="checkbox" name="options[3][]" id="options_3_text_Thursday" class="checkbox" title="Thursday" value="Thursday"><label for="options_3_text_Thursday"> Thursday</label>
		<input type="checkbox" name="options[3][]" id="options_3_text_Friday" class="checkbox" title="Friday" value="Friday"><label for="options_3_text_Friday"> Friday</label>
		<input type="checkbox" name="options[3][]" id="options_3_text_Saturday" class="checkbox validate-one-required-by-name" title="Saturday" value="Saturday"><label for="options_3_text_Saturday"> Saturday</label>
	</div>
 </div>

CSS

.checkboxes label {
    display: block;
    float: left;
    padding-right: 10px;
    white-space: nowrap;
}
.checkboxes input {
    vertical-align: middle;
}
.checkboxes label span {
    vertical-align: middle;
}