我有一个容器<div>用display: flex。它有一个孩子<a>。
如何让孩子显得“内联”?
具体来说,如何让孩子的宽度由其内容决定,而不是扩展到父母的宽度?
我尝试了什么:
我把孩子设置为display: inline-flex,但它仍占用了整个宽度。我也尝试了所有其他显示属性,但没有任何效果。
例:
.container {
background: red;
height: 200px;
flex-direction: column;
padding: 10px;
display: flex;
}
a {
display: inline-flex;
padding: 10px 40px;
background: pink;
}
<div class="container">
<a href="#">Test</a>
</div>
http://codepen.io/donpinkus/pen/YGRxRY
netizen
红糖糍粑