在剃刀中添加没有 br 的元素答案

【问题标题】：Adding elements without br in razor在剃刀中添加没有 br 的元素
【发布时间】：2011-07-02 18:30:58
【问题描述】：

我想知道如何在不换行的情况下向页面添加元素

现在我有一段代码：

@foreach (var item in Model.TagModels)
    { 

        <div class="editor-field">
            @Html.EditorFor(model => item.Name)
            @Html.ValidationMessageFor(model => item.Name)
        </div>

    }

它将我的输入添加到页面，但带有断线。

我想把它排成一排。能做到吗？

【问题讨论】：

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

【解决方案1】：

试试这个：

@foreach (var item in Model.TagModels)
{ 

    <div class="editor-field" style="float: left">
        @Html.EditorFor(model => item.Name)
        @Html.ValidationMessageFor(model => item.Name)
    </div>

}

CSS 中的 float 属性用于对齐。这会将所有 div 放在一行中。每个 DIV 都添加到前一个 DIV 的右侧

【讨论】：

【解决方案2】：

正是您的输入所在的 div 容器导致它们出现在彼此下方。只需删除 div 或将其替换为 span 或 display:inline

【讨论】：

【解决方案3】：

验证消息可能是一个 div。尝试将 CSS 更改为 display:inline

【讨论】：