我有一个容器<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>