单选按钮布局在Django模板中搞砸了

Question

我有Django模板，用户填写她的生物，手机号码，年龄，性别和婚姻状况。性别和婚姻状况是具有两个选项的单选按钮，前3个选项是文本字段。模板布局如此：

<system.serviceModel>
   <services>
     <service name="PubSubServiceLib.PubSubService">
        <endpoint 
            address="" 
            binding="wsDualHttpBinding"
            contract="PubSubServiceLib.IPubSubService">
        </endpoint>
        <host>
           <baseAddresses>
              <add baseAddress="http://192.168.2.131:8089/"/>
           </baseAddresses>
        </host>
      </service>
   </services>
   <bindings>
      <wsDualHttpBinding>
         <binding receiveTimeout="00:30:00" sendTimeout="00:30:00" 
                  maxReceivedMessageSize="2147483647">
            <reliableSession inactivityTimeout="02:00:00"/>
         </binding>
      </wsDualHttpBinding>
   </bindings>
   <behaviors>
      <serviceBehaviors>
         <behavior>
            <serviceMetadata httpGetEnabled="True"/>
            <serviceDebug includeExceptionDetailInFaults="False"/>
         </behavior>
      </serviceBehaviors>
   </behaviors>
</system.serviceModel>

此表单以单独的行显示文本字段，但单选按钮显示为缩进。看截图：

如何使单选按钮与表单的其余部分内联？我无法理解为什么这样的事情会如此。我的代码很简陋。

修改 我不想将所有内容都包装在一个表格中，因为虽然它解决了问题，但表格对于小屏幕尺寸（例如功能手机，对我来说是一个关键市场）并不敏感。

Answer 1

将上述代码更改为以下内容：

<form method="post" action="">
  {% csrf_token %}
  {{ form.bio.errors }}<p>
  {{ form.bio.label_tag }}{{ form.bio }}<p>
  {{ form.mobilenumber.errors }}<p> 
  {{ form.mobilenumber.label_tag }}{{ form.mobilenumber }}<p>   
  {{ form.age.errors }}<p>  
  {{ form.age.label_tag }}{{ form.age }}<br>
  {{ form.gender.errors }}
  {{ form.gender.label_tag }}<br>{% for radio in form.gender %}<table><tr><label for="{{ radio.id_for_label }}"><td><span style="margin-left:2em">{{ radio.choice_label }}</span><span style="margin:auto">{{ radio.tag }}</span></td></label></tr></table>{% endfor %}<br>
  {{ form.marital_status.errors }}
  {{ form.marital_status.label_tag }}<br>{% for radio in form.marital_status %}<table><tr><label for="{{ radio.id_for_label }}"><td><span style="margin-left:2em">{{ radio.choice_label }}</span><span class="radio">{{ radio.tag }}</span></td></label></tr></table>{% endfor %}<br>
  <input class="button" style="background-color:#F6F6F6" type="submit" value="Save">
</form>

参考：https://docs.djangoproject.com/en/1.8/ref/forms/widgets/#django.forms.RadioSelect 我需要的是粒度控制而不是我的单选按钮;我上面写的代码恰恰说明了这一点。