使用 Razor 在 ASP.NET MVC 4 中防止 @Html.LabelFor 后换行答案

【问题标题】：Prevent Line Break After @Html.LabelFor In ASP.NET MVC 4 Using Razor使用 Razor 在 ASP.NET MVC 4 中防止 @Html.LabelFor 后换行
【发布时间】：2012-06-24 01:58:37
【问题描述】：

这是我的代码。

@using (Html.BeginForm()) {
@Html.ValidationSummary()

<fieldset>
    <legend>Registration Form</legend>
    <ol>
        <li>
            @Html.LabelFor(m => m.FirstName)
            @Html.TextBoxFor(m => m.FirstName)
        </li>
    </ol>
 </fieldset>
}

从上面的代码中，标签和文本框位于不同的行上。我想将它们组合在同一条线上，这样我就可以拥有类似...

@Html.LablFor(m => m.FirstName): @Html.TextBoxFor(m => m.FirstName)

最终应该看起来像 FirstName：_______

提前致谢。

【问题讨论】：

您可以使用 css 实现此目的，但我们需要查看您的 html。

标签： asp.net-mvc razor html-helper

【解决方案1】：

您的 CSS 一定有问题，因为 <label> 和 <input> 都是内联元素。它们出现在不同行上的唯一原因是您的 CSS 将它们视为块元素，或者它们不能放在同一行内容中。

jsFiddle 中的演示：http://jsfiddle.net/tSFtJ/

【讨论】：

我要去检查一下，我什至没有想到。必须是执行此操作的 MS 的默认 CSS。谢谢。

【解决方案2】：

这是我为使这项工作为我所做的工作（以下代码的 sn-p）。
查看模型

<!-- language: c# -->
[DataType(DataType.EmailAddress)]
[Display(Name = "LabelEmail", ResourceType = typeof(Resources.GeneralResource))]
public string EmailAddress { get; set; }

View.cshtml

<!-- language-all: lang-html -->
<div>
    @Html.LabelFor(m => m.EmailAddress, new { style="display:inline;"})
    @Html.DisplayFor(m => m.EmailAddress)
</div>

重要的是：
新 { style="display:inline;"}
在 LabelFor(..).
像魅力一样工作。

【讨论】：