Html 在具有动画的div中居中对象

尝试将动画设置为对象，但仅当我以外部div为目标时才能使其工作。当我以对象为目标时，似乎不起作用

.more {
    display:block;
    position:absolute;
    bottom: 4rem;
    width: 100%;
    text-align: center; 
    background: red;
    opacity: .5;
}

.more1 {    
    -webkit-transition: bottom;
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 500ms;

}

.more1:hover {
    -webkit-transition: bottom;
    -webkit-transition-timing-function: ease-in;
    -webkit-transition-duration: 500ms;
    bottom: 2rem;
}

这就是我认为有效的方法：

我得到了最近的，但只希望它以对象为目标，而不是以对象为中心的div

---

谢谢，任何帮助都会很好

不是每个人都有webkit浏览器来测试它。。。您应该始终记住没有任何前缀的CSS3转换…；）-moz和-o也应该很好：）。我的不好，它只是我正在使用的，只是在我的工作中做了一个快速复制+粘贴的工作。现在已修复：）