我似乎无法弄清楚如何让两个列的高度相同。我从几个例子中复制了代码,并没有产生相同的结果。
<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;
}