如何在 mvc4 中水平和垂直对齐单选按钮列表值？答案

【问题标题】：How to align radiobutton list values horizontally and vertically in mvc4?如何在 mvc4 中水平和垂直对齐单选按钮列表值？
【发布时间】：2014-09-12 18:08:40
【问题描述】：

我有大约 35 个单选按钮列表值要显示在我的视图中，使用 .cshtml 页面中的 @html.RadioButtonFor html 助手。

我想显示为 9 列 4 行。

在 Asp.net 中使用“RepeatLayout”、“RepeatDirection”、“RepeatColumns”等控件属性，我们可以实现这一点。

我想将它应用于 mvc4。有什么方法可以实现吗？

请帮忙！

控制器代码：

ViewBag.Ratio = query.Select(m => new SelectListItem { Value = m.RatioID, Text = m.Ratio_Description });

.cshtml代码

 <td colspan="3" >

            @foreach (var item in (IEnumerable<SelectListItem>)ViewBag.Ratio)
                  { 
                         @Html.RadioButtonFor(m => m.RatioType, new { @item.Value, @item.Text })
                        <label for = "@item.Value">@item.Text</label>

                  }


            </td>

【问题讨论】：

你可以使用nth-child()调整你的CSS
请粘贴您的代码
嗨，Jay，这是我的代码

标签： c# css asp.net-mvc-4

【解决方案1】：

最好的方法是使用这样的表：http://jsfiddle.net/z2L3qbh9/1/ 或者尝试像这样使用 css 管理它：

.eachRadioBtn{
    width:11%;
    float:left;
}

用 div 标签包裹每个 radioBottuon：

<div class=".eachRadioBtn">
    @HTML.RadioButtonFor( ... )
</div>

【讨论】：

嗨 Masoud，我不能像 jsfiddle 演示那样使用，因为我正在使用 foreach 循环获取值
@user3406037 您可以从浏览器中复制粘贴代码，然后在应用 css 的情况下粘贴！
@user3406037，嗨。尝试其他方式（.eachRadio）。同样在 for each 你可以定义一个 var 像： int i = 0;当 i%9==0;关闭预览 tr 并添加新的 tr