首页 > 解决方案 > W3schools CSS 联系表格与另一个 div 合并

问题描述

<link href="https://www.w3schools.com/w3css/4/w3.css" rel="stylesheet"/>
<p>Please open this in full screen</p>
<form class="w3-container w3-half">
<label>Name</label>
<input type="text" class="w3-input w3-border"/><br/>
<input type="submit" class="w3-button w3-black"/>
</form>
<p class="w3-padding w3-center w3-card-4">© Copyright 123456789. All rights Reserved.</p>

如您所见,表单正在合并到版权栏中。如何纯粹使用 w3-css 来防止这种合并。我希望表格不要合并到版权栏中。并在版权栏上方单独显示表格。

标签: htmlcss

解决方案


只是一个疯狂的想法,但尝试w3-container而不是w3-padding......

编辑

正如其他评论所述,w3-half包含float. 所以你的页脚应该包含clear......

<link href="https://www.w3schools.com/w3css/4/w3.css" rel="stylesheet"/>
<p>Please open this in full screen</p>
<form class="w3-container w3-half">
<label>Name</label>
<input type="text" class="w3-input w3-border"/><br/>
<input type="submit" class="w3-button w3-black"/>
</form>
<p class="w3-padding w3-center w3-card-4" style="clear: both;">© Copyright 123456789. All rights Reserved.</p>


推荐阅读