相关疑难解决方法(0)

我在使用css3变换旋转过渡的chrome中遇到了问题.转换工作正常,但在完成后元素移动一个像素.另一个奇怪的事情是它只在页面居中(margin:0 auto;)时才会发生.如果你也删除了转换,那么bug仍然存在.

你可以在这里看到它:

http://jsfiddle.net/MfUMd/1/

HTML:

<div class="wrap">
    <img src="https://github.com/favicon.ico" class="target" alt="img"/>
</div>

<div class="wrap">
    <div class="block"></div>
</div>

CSS:

.wrap {
    margin:50px auto;
    width: 100px;
}
.block {
    width:30px;
    height:30px;
    background:black;
}
.target,.block {
    display:block;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}
.target:hover,.block:hover {
    -webkit-transform: rotate(90deg); 
    -moz-transform: rotate(90deg); 
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);  
}

注释掉该margin:0 auto;线以使其消失.

任何人都有任何想法如何在保持页面居中的同时阻止这一点？

我在OSX 10.6.8上使用的是版本24.0.1312.57

干杯

我有一个div,所以当我点击它时,它将切换为展开或缩回.它适用于所有浏览器,但有一点让我感兴趣.在谷歌浏览器收缩时,它会从机芯中留下小线. www.rezoluz.com/login.php - 该页面

要查看它,请使用Google Chrome打开该页面.然后单击注册按钮两次,第二次它将保留行,通常,但不在其他浏览器上.我正在使用标准的.animate,使用jquery.非常感谢所有帮助.

截图:

此外,这里有一个显示结果的jsfiddle:http://jsfiddle.net/rwQPu/2/.Chrome 21.0.1180.81 beta-m Win7出错.