Use table to layout the radio buttons : radio « Form « HTML / CSS






  1. HTML / CSS
  2. Form
  3. radio

Use table to layout the radio buttons

  


<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Form Example</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
td {
  width: 130px;
}</style>
</head>

<body>

<form action="" method="post" name="frmSurvey">
  <table>
    <tr>
      <td><label for="q37">Strongly agree</label></td>
      <td></td>
      <td></td>
      <td><label for="q34">Neutral</label></td>
      <td></td>
      <td></td>
      <td><label for="q31">Strongly disagree</label></td>
    </tr>
    <tr>
     <td><input type="radio" name="radQ3" value="7" id="q7" 
                 title="strongly agree" /></td>
      <td><input type="radio" name="radQ3" value="6" id="q6" 
                 title="agree" /></td>
      <td><input type="radio" name="radQ3" value="5" id="q5" 
                 title="somewhat agree" /></td>
      <td><input type="radio" name="radQ3" value="4" id="q4"
                 title="neutral" /></td>
      <td><input type="radio" name="radQ3" value="3" id="q3"
                 title="somewhat disagree" /></td>
      <td><input type="radio" name="radQ3" value="2" id="q2"
                 title="disagree" /></td>
      <td><input type="radio" name="radQ3" value="1" id="q1"
                 title="strongly disagree" /></td>
    </tr>
  </table>
</form>

</body>
</html>








Related examples in the same category

1.input type = "radio" creates a radio button
2.radio button
3.Set input radio button background color and color
4.Creates a radio button
5.Labelling Radio Buttons
6.Radio Button
7.Preselected Radio Example