CSS-同一行的元素高度统一

一：flex 大法

步骤

1. 设置外部容器 display: flex;
2. 设置内部容器 align-items: stretch;

原理

https://developer.mozilla.org/zh-CN/docs/Web/CSS/CSS_Flexible_Box_Layout

示例

<style>
    /*1. 设置外部容器 display: flex;*/
    .container{
        display: flex;
    }
    .container > div:nth-child(1){
        background: pink;
    }
    .container > div:nth-child(2){
        background: yellow;
    }
    .container > div:nth-child(3){
        background: red;
    }
    /*2. 设置内部容器 align-items: stretch;*/
    .box{
        align-items: stretch;
        width: 100px;
        margin-left: 20px;
    }
</style>
<div class="co