html - 在我的验证消息ASP.Net MVC中添加换行符

我有一条验证消息，在它的正下方，我有一个带有一些文本的文本字段。
当隐藏验证消息时，文本字段下方的文本很好，但是当验证消息显示时，如以下图片所示，它与下面的文本一致。有什么办法可以解决此问题，以使验证消息显示在一行上，文本显示在下面的一行上？





这是验证消息的html代码

<div class="form-group">
  <label for="lastNameName" class="col-sm-2 control-label">Last Name</label>
  <div class="col-sm-10">
    @Html.TextBoxFor(m => m.ProfileGeneralViewModel.LastName, new { @id = "lastName", @class = "form-control" })
    @Html.ValidationMessageFor(m => m.ProfileGeneralViewModel.LastName, "", new { @class = "text-danger" })
    <text>Your public profile only shows your first name.</text>
  </div>
</div>

这是渲染的HTML

<div class="form-group">
  <label class="col-sm-2 control-label" for="lastNameName">Last Name</label>
  <div class="col-sm-10">

    <input name="ProfileGeneralViewModel.LastName" class="form-control input-validation-error" id="lastName" aria-invalid="true" aria-describedby="lastName-error" type="text" value="pareto" data-val="true" data-val-regex-pattern="^[A-Za-z0-9_]+$" data-val-regex="Hey, no funny symbol stuff"
      data-val-minlength-min="4" data-val-minlength="Minimum length is 4" data-val-maxlength-max="18" data-val-maxlength="Maximum length is 18">
    <span class="text-danger field-validation-error" data-valmsg-replace="true" data-valmsg-for="ProfileGeneralViewModel.LastName"><span id="lastName-error">Minimum length is 4</span></span>
    <text>Your public profile only shows your first name.</text>
  </div>
</div>

最佳答案

最好对bootstrap使用class="help-block"类（<text>Your public profile only shows your first name.</text>），如下所示：

<div class="form-group">
  <label class="col-sm-2 control-label" for="lastNameName">Last Name</label>
  <div class="col-sm-10">

    <input name="ProfileGeneralViewModel.LastName" class="form-control input-validation-error" id="lastName" aria-invalid="true" aria-describedby="lastName-error" type="text" value="pareto" data-val="true" data-val-regex-pattern="^[A-Za-z0-9_]+$" data-val-regex="Hey, no funny symbol stuff"
      data-val-minlength-min="4" data-val-minlength="Minimum length is 4" data-val-maxlength-max="18" data-val-maxlength="Maximum length is 18">
    <span class="text-danger field-validation-error" data-valmsg-replace="true" data-valmsg-for="ProfileGeneralViewModel.LastName"><span id="lastName-error">Minimum length is 4</span></span>

    <div class="help-block">Your public profile only shows your first name.</div>

  </div>
</div>

Online output

有关验证器元素的Bootstrap类的更多信息，请参见this。

关于html - 在我的验证消息ASP.Net MVC中添加换行符，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/46047880/