C# MVC 在同一行中制作 html 单选按钮答案

【问题标题】：C# MVC Making html radio buttons in the same lineC# MVC 在同一行中制作 html 单选按钮
【发布时间】：2017-01-18 07:04:14
【问题描述】：

我正在使用 C# MVC 和 AngularJS 编写一个网页，我需要制作一个带有分配标签的单选按钮的水平列表（并检查 cuttons）。问题是它们以我尝试的每一种方式呈现在一个垂直列表中。

我试过了：

<div align="center">
      <label class="col col-20" style="display:inline" align="center"><input id="WeekRad" align="center" type="radio" style="display:inline" ng-model="Week" ng-click="ThisWeek()" />This Week</label>
      <label class="col col-20" style="display:inline" align="center"><input id="DatesRad" align="center" type="radio" style="display:inline" ng-model="Dates" ng-click="BetweenDates()" />Between Dates</label>
</div>

我也试过了：

 <span>
       <ul>
           <li style="display:inline">
                <label class="col col-20" style="display:inline" align="center"><input id="WeekRad" align="center" type="radio" style="display:inline" ng-model="Week" ng-click="ThisWeek()" />This Week</label>        
             </li>
            <li style="display:inline">
                <label class="col col-20" style="display:inline" align="center"><input id="DatesRad" align="center" type="radio" style="display:inline" ng-model="Dates" ng-click="BetweenDates()" />Between Dates</label>     
             </li>
        </ul>
 </span>

我尝试过使用和不使用<span>，使用和不使用标签，使用和不使用style="display:inline"，但每次都保持垂直。

【问题讨论】：

标签： c# html css angularjs radio-button

【解决方案1】：

终于找到解决方案了：

        <div class="row" align="center" style="margin:auto; max-width:300px">
            <div class="col-lg-6" align="center">
                <div class="input-group" align="center">
                    <span class="input-group-addon" align="center">
                        <label class="col col-20" style="display:inline" align="center">
                            <input id="WeekRad" align="center" type="radio" style="display:inline" />This Week
                        </label>
                    </span>
                </div>
            </div>
            <div class="col-lg-6" align="center">
                <div class="input-group" align="center">
                    <span class="input-group-addon" align="center">
                        <label class="col col-20" style="display:inline" align="center">
                            <input id="DatesRad" align="center" type="radio"/>Between dates
                        </label>
                    </span>
                </div>
            </div>
        </div>

【讨论】：

【解决方案2】：

给外部 div 一个宽度，并将单选按钮放在内部 div 中。

围绕宽度播放以调整对齐方式。

<div align="center" style="width:***px">
<div style="float:left; width:48%">
**radio
</div>
<div style="float:left; width:48%">
**radio
</div>
</div>

这应该可以工作

【讨论】：

你的意思是这样的：

周

Dates

我给了外部 div 小价值和大的，相同的结果。