Html 相同的类有不同的行为

我正在努力让我的文章推广的盒子工作，因为我希望他们。第一个盒子按照预期工作，我希望之后的每个盒子都能像预期的那样工作。但是，当您将图像悬停在第一个框之后的任何框上时，它不会触发hover类

我认为问题在于当框类悬停时如何选择image类。如果有任何帮助，我将不胜感激

.ogse容器{
边缘顶部：150px；
左边距：10px；
位置：相对位置；
垫面：5px；
左侧填充：45px；
右边填充：45px；
宽度：600px；
高度：200px；
背景色：#fff；
边框：0px实心#666；
盒影：0px 0px 30px-5px#333；
文本溢出：省略号；
}
.食人魔方面{
位置：绝对位置；
顶部：0px；
左：0px；
宽度：45px；
身高：100%；
背景色：#a00；
}
.ogse img{
位置：绝对位置；
高度：100px；
宽度：80%；
左：10%；
顶部：-45px；
z指数：-1；
过渡：top.2s；
}
.ogse容器：hover.ogse img{
顶部：-100px；
}
.ogse标题{
文本对齐：居中；
}
ogse先生，第{
文本对齐：居中；
}

一些示例文本，一些重要的东西，我现在还不能告诉任何人。所以我要让这篇文章成为一个大谜团。
一些示例文本，一些重要的东西，我现在还不能告诉任何人。所以我要让这篇文章成为一个大谜团

我刚刚重新构建了HTML，并对CSS进行了一些编辑：

.ogse容器{
位置：相对位置；
宽度：690px；
}
.ogse容器内侧{
位置：绝对位置；
顶部：0px；
左：0px；
宽度：45px；
身高：100%；
背景色：#a00；
}
.ogse容器内部img{
位置：绝对位置；
高度：100px；
宽度：80%；
左：10%；
顶部：-45px；
过渡：top.2s；
}
.ogse容器内部img分区{
身高：100%；
宽度：100%；
}
.ogse容器：hover.ogse容器内部img{
顶部：-100px；
}
.ogse容器内部文本{
边缘顶部：150px；
位置：相对位置；
宽度：600px；
高度：200px；
垫面：5px；
左侧填充：45px；
右边填充：45px；
背景色：#fff；
边框：0px实心#666；
盒影：0px 0px 30px-5px#333；
文本溢出：省略号；
}
.ogse标题，
ogse先生，第{
文本对齐：居中；
}

一些示例文本，一些重要的东西，我现在还不能告诉任何人。所以我要让这篇文章成为一个大谜团
一些示例文本，一些重要的东西，我现在还不能告诉任何人。所以我要让这篇文章成为一个大谜团

您在哪个浏览器中测试？该代码段在Chrome53中适用。@bbodien我有相同的浏览器和版本。尝试将第二个框的图像悬停。与第一个盒子不同，它不会触发：hover类。非常感谢，它完美无缺！你能解释一下为什么这样做吗？即OP问题的原因是什么？