0

このようにラジオボタンを上下に表示するにはどうすればよいですか?

                 Sex                 (button)Male
                                     (button) Female

私が何をしても、私はこのようになります

                   Sex                 (button)Male
                   (button) Female

2 番目のラジオ ボタンの左マージンを最初のラジオ ボタンのすぐ下に配置するにはどうすればよいですか?

            <label for="Sex">Sex:</label>
            <asp:RadioButton ID="male" runat="server" GroupName="gender" 
                    Text="Male"/>
            <br/>

            <asp:RadioButton ID="female" runat="server" GroupName="gender" Text="Female"/>
4

4 に答える 4

1

アイテムを並べてグループ化するかdiv、2 番目のアイテムを揃えるためにスペースを追加する必要があります。

フローティング div:

<div style="float: left;">
       <span>Sex:</label>
</div>
<div style="float: left;">
    <asp:RadioButton ID="male" runat="server" GroupName="gender" Text="Male"/>
    <br/>
    <asp:RadioButton ID="female" runat="server" GroupName="gender" Text="Female"/>        
</div>
<div style="clear: both"></div>

またはパディング付き：

<style>
    .radioButtonPadding {
        display: inline-block;
        width: 45px;
    }
</style>

<span class="radioButtonPadding">Sex:</label>
<asp:RadioButton ID="male" runat="server" GroupName="gender" Text="Male"/>
<br/>
<span class="radioButtonPadding">&nbsp;</label>
<asp:RadioButton ID="female" runat="server" GroupName="gender" Text="Female"/>

としてもできます。RadioButtonList

<style>
    .genderLabel {
        float: left;
        display: block;
    }
    .genderList {
        float: left;
    }
    .clear {
        clear: both;
    }
</style>

<asp:Label id="genderLabel" runat="server" CssClass="genderLabel"       
    Text="Sex:" AssociatedControlID="genderList"/>
<asp:RadioButtonList id="genderList" runat="server" CssClass="genderList">
   <asp:ListItem>Male</asp:ListItem>
   <asp:ListItem>Female</asp:ListItem>
</asp:RadioButtonList>
<div class="clear"></div>
于 2012-07-03T16:58:29.593 に答える
0

http://jsfiddle.net/charlescarver/fUvZR/1/

div幅が設定されたコンテナが必要で、そのdiv中に 2 つの が横に浮かんでいます。

于 2012-07-03T16:59:14.703 に答える
0

RadioButtonList を使用する

<asp:RadioButtonList ID="RadioButtonList1"
    runat="server" AutoPostBack="True" CausesValidation="True" 
    onselectedindexchanged="RadioButtonList1_SelectedIndexChanged">
    <asp:ListItem Selected="True">male</asp:ListItem>
    <asp:ListItem>female</asp:ListItem>
</asp:RadioButtonList>
于 2012-07-03T16:59:20.210 に答える
0

RadioButtonList コントロールを使用して、RepeatDirection プロパティを Horizo​​ntal に設定するだけです。

http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.radiobuttonlist.repeatdirection.aspx

于 2012-07-03T16:59:40.247 に答える