CSS使内联块填充父级

<style>
    .clearfix::after {
        content: "";
        display: table;
        clear: both;
    }
    .child {
        float: left;
        width: 50%;
    }
</style>

<div class="parent clearfix">
    <div class="child">内联块1</div>
    <div class="child">内联块2</div>
</div>

<style>
    .parent {
        display: flex;
    }
    .child {
        flex: 1;
    }
</style>

<div class="parent">
    <div class="child">内联块1</div>
    <div class="child">内联块2</div>
</div>

<style>
    .parent::before {
        content: "";
        display: table;
        clear: both;
    }
    .child {
        display: inline-block;
    }
</style>

<div class="parent">
    <div class="child">内联块1</div>
    <div class="child">内联块2</div>
</div>