css - 从 auto 过渡到 flex-basis

Question

是否有将 flex-basis 从 auto 转换为其他值的技巧？据我所知，这是该规则的一个异常(exception)......这很烦人，因为它可以说是最有用的。

这是一个例子: http://codepen.io/jamiewinder/pen/WrgrEB

单击“切换”按钮应使用过渡打开抽屉。不透明度有效，但使用 flex-basis 定义的高度却无效。如果我将 flex-basis 设置为像素数、百分比或 auto 以外的任何值，它就可以工作，这意味着我需要按顺序知道内容的高度使其正常工作。

我错过了什么吗？

Answer 1

flex-basis 可以进行动画和过渡 ( source )。但是，与其他属性一样，只有将值设置为实际长度值(例如 px、% 等和 calc())。更多信息可参见this问题。