下面是一个屏幕截图以及来自 ASP MVC 网站的 HTML 副本。最后一个段落元素(在代码底部)与其他两个字段集水平对齐,但是我需要它位于页面底部。HTML/网页设计一直是我的致命弱点,所以如果有人能解释发生了什么以及可能的解决方案,我将不胜感激。
@model Monet.Models.FollowUpItems
@{
ViewBag.Title = "Edit";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>Edit Follow Up Item</h2>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"> </script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
@using (Html.BeginForm()) {
@Html.ValidationSummary(true)
<div>
<span style = "float:left;padding-right:4em">
<fieldset>
<legend>Status Items</legend>
<div class="error">
@ViewBag.ErrorMessage
</div>
@Html.HiddenFor(model => model.Id)
<div class="editor-label">
@Html.LabelFor(model => model.Status)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Status)
@Html.ValidationMessageFor(model => model.Status)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Notes)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Notes)
@Html.ValidationMessageFor(model => model.Notes)
</div>
<p>
<input type="submit" value="Save" />
</p>
</fieldset>
</span>
<span style="clear:both;"></span>
<span style="float:left;">
<fieldset>
<legend>Basic Info</legend>
<div class="editor-label">
@Html.LabelFor(model => model.TableName)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.TableName)
@Html.ValidationMessageFor(model => model.TableName)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Message)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Message)
@Html.ValidationMessageFor(model => model.Message)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.CreatedBy)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.CreatedBy)
@Html.ValidationMessageFor(model => model.CreatedBy)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.CreatedOn)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.CreatedOn)
@Html.ValidationMessageFor(model => model.CreatedOn)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.LastUpdateBy)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.LastUpdateBy)
@Html.ValidationMessageFor(model => model.LastUpdateBy)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.LastUpdateOn)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.LastUpdateOn)
@Html.ValidationMessageFor(model => model.LastUpdateOn)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Key1)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Key1)
@Html.ValidationMessageFor(model => model.Key1)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.Key2)
</div>
<div class="editor-field">
@Html.EditorFor(model => model.Key2)
@Html.ValidationMessageFor(model => model.Key2)
</div>
<div class="editor-label">
@Html.LabelFor(model => model.IssueType)
</div>
<div class="editor-label">
@Html.EditorFor(model => model.IssueType)
@Html.ValidationMessageFor(model => model.IssueType)
</div>
</fieldset>
</span>
</div>
<span style="clear:both;"></span>
}
<span style="clear:both;"></span>
<p>
@Html.ActionLink("Back to List", "Index")
</p>