CSS - 常识 - float

• 使块元素在一行显示。float: left;

.section1 {
    float: left;
}
<div>
    使块元素在一行显示。float: left;
</div>
<div>
    <section class="section1">section1</section>
    <section class="section2">section2</section>
</div>

.section1, .section2 {
    float: left;
}
<div>
    使块元素在一行显示。float: left;
</div>
<div>
    <section class="section1">section1</section>
    <section class="section2">section2</section>
</div>

• 使用了 float 的元素，没有实现并排效果，可能原因在于父级的宽度不够，导致元素无法并排显示。

.parentSection {
    width: 30px;
}
.childSection1 {
    float: left;
}

<div>
    使用了 float 的元素，没有实现并排效果，可能原因在于父级的宽度不够，导致元素无法并排显示。
</div>
<section class="parentSection">
    <section class="childSection1">childSection1</section>
    <section class="childSection2">childSection2</section>
</section>