Example 2: Labeling radio buttons using TITLE

Best Practice Rating: Poor

Example Start

Select pizza crust

Example End

HTML Source Code

<div class="label">Select pizza crust</div>
<ul class="radio">
  <li><input type="radio" name="crust" value="deep" title="Deep dish"/>Deep dish</li>
  <li><input type="radio" name="crust" value="thick" title="Thick"/>Thick</li>
  <li><input type="radio" name="crust" value="hand" title="Hand thrown"/>Hand thrown</li>
  <li><input type="radio" name="crust" value="thin" title="Thin"/>Thin</li>
</ul>

CSS Source Code

  <style type="text/css">
div.label {
  margin: 0;
  padding: 0;
  margin-left: 20px;
  font-weight: bold;
}

ul.radio {
  margin: 0;
  padding: 0;
  margin-left: 20px;
  list-style: none;
}


  </style>