无法使flexbox列的高度相等

时间:2017-11-11 02:37:25

标签: css css3 flexbox

我似乎无法弄清楚如何让两个列的高度相同。我从几个例子中复制了代码,并没有产生相同的结果。

<div class="flex-container">
    <div class="list">
        <ul>
            <li>Item 1</li>
            <li>Item 2</li>
            <li>Item3</li>
        </ul>
    </div>
    <div class="cta">
        <a>Link</a>
    </div>
</div>


.flex-container {
    display: flex;  
    flex-flow: row nowrap;
    align-items: center;
}

.flex-container div {
    display:flex;
}
.flex-container .list {
    width: 70%;
    background:#cccccc;
}
.flex-container .cta {
    width: 30%;
    text-align:center;
    background:#000;
    color:#fff;
    padding:10px;
}

https://codepen.io/aro_007/pen/VrpGLV

0 个答案:

没有答案