即时过渡 - 持续时间不起作用？

Question

解决方案找到了（添加＆＃34;顶部：0px＆＃34;到.logo-box，因为它需要一个转换的地方）

我的网站左上方有一个徽标，我想让它在它的div＆＃34; hover-box＆＃34;徘徊，它确实。但在某些时候，过渡停止了0.2秒，现在只是瞬间，为什么？

的CSS：

#hover-box:hover > .logo-box {
top: 74px;
}
.logo-box {
width: 150px;
position: relative;
background-color: black;
border-bottom-left-radius: 15px;
border-bottom-right-radius: 15px;
transition: top 0.2s ease-out;
}

Answer 1

添加

top: 0px;

到.logo-box（非悬停）

需要从过渡：）

Answer 2

我看到的问题是你正在应用转换到顶级属性，但它不在那个特定的类中。我认为你必须在该课程中加入顶级。

.logo-box {
top: 0;
width: 150px;
position: relative;
background-color: black;
border-bottom-left-radius: 15px;
border-bottom-right-radius: 15px;
transition: top 0.2s ease-out;
}