回流时的 CSS3 过渡

Question

以这个dom为例。

<div id="container" style="transition: width 1s ease-in-out;">
  <div style="width: 400px; display: none;"></div>
  <div style="width: 200px;"></div> 
</div>

如果我交替隐藏哪个内部 div，我可以触发 CSS3 转换（通过重排）吗？如果可能的话，我可以添加许多内部 div 并在它们之间顺利交替，而不必知道它们的大小。

Answer 1

我认为仅通过 CSS 是不可能的 - 过渡是不可继承的，因此它们必须应用于有问题的嵌套元素，并且在没有宽度的情况下无法应用宽度过渡，例如嵌套的 div 需要将 width 和 0 设置为在悬停或 JS 单击或某些事件时在它们之间转换

但是我认为我真的没有理解这个问题；

#container div {transition: width 1s ease-in-out;}

会将其应用于所有子 div，然后您只需切换显示和宽度，但是您仍然想这样做吗？