等分布局

提供一种flex实现
html代码如下

<div class="parent">    <div class="column">        <p>1</p>    </div>    <div class="column">        <p>2</p>    </div>    <div class="column">        <p>3</p>    </div>    <div class="column">        <p>4</p>    </div></div>

CSS代码

.parent{
    display: flex;
}
.column{
    flex: 1;
}
.column+.column{
    margin-left: 20px;
}

等高布局
用table flex