css - 默认脚手架的样式

Question

我如何设计 (CSS) 默认脚手架以使标签和编辑器位于同一行(标签列具有固定宽度)

    <div class="editor-label">
        @Html.LabelFor(model => model.Price)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.Price)
        @Html.ValidationMessageFor(model => model.Price)
    </div>

Answer 1

您可能需要调整宽度。边框仅在您进行开发时用作指南。

<style type="text/css">

.editor-label {
    float: left;
    border: 1px solid red;
    width: 200px;
    margin-bottom: 4px;
    }

.editor-field {
    float: left;
    width: 400px;
    border: 1px solid green;
    }

.editor-label:before {
    clear: left;
    }

</style>