避免在 SPAN 内部进行 DIV - 最佳实践

Question

DIV 是一个块级元素，不得嵌套在 SPAN 中。但许多主题劫持了这种最佳实践。应该应用什么CSS来绕过这些错误？

<span class="fields col-lg-6">
    <div class="field">
        <label>Otp<span style="color: red;"> *</span></label>
        @Html.TextDoxFor(m => m.Otp)
    </div>
</span>

Answer 1

没有 CSS 可以绕过由 HTML 构造引起的错误。您必须在代码中手动执行此操作。

但在你的情况下，它是可选的，这取决于你想要什么。

1# 如果你想避免<div>的block风格，你可以使用这个 CSS：

span>div{display:inline;}

或适用于span内的所有儿童

span div{display:inline;}

2#如果你想避免<span>的inline样式，你可以使用这个 CSS：

span.fields{display:block;}

或筑巢，所有的孩子都正常

span.fields{display:inline-block;}

希望这对您有帮助。