html - 在表单中的标签中添加 CSS float 使背景颜色消失

Question

我需要为表单应用背景颜色。不幸的是，每当我将 float: left 添加到 p 标签时，背景颜色立即消失。

HTML示例如下:

<form id='register'>
    <p><label for='name'> Name: </label>
    <input type='text' id='name' pattern='[a-zA-Z].{3,70}'> </input></p>
    <p><label> email: </label> 
    <input type='email' id='email' placeholder='abc@example.com'></input></p>

导致这种情况的 CSS 如下:

#register p{
float:left;
}

为什么float属性会影响背景，如何解决？

Answer 1

将 CSS 更改为:

#register p{
    float:left;
}

form {
    background-color:red;
    overflow:auto;
}

Working Fiddle