我在跨浏览器问题上不是很有经验，但我遇到了这个问题：
场景： 假设我有div，width:800px因为div我有 2 个按钮（左箭头-右箭头），onclick在任何按钮上我更改图像位置div（图像向右或向左移动，但保持在外部div）
问题：当我重新调整大小或降低屏幕分辨率时，我的 CSS 会发生变化；图像从 div 中消失，并且我的按钮的位置也发生了变化。
有什么想法或解决方案吗？谢谢。
编辑：它在 Firefox 和 Opera 中运行良好，但在 Google Chrome 和 IE 中无法运行。
下面是html：
<div class="hand">
<div id="handinside"></div>
</div>
<div id="left" class="button"> left </div>
<div class="flip"></div>
<div id="right" class="button">right</div>
</div>
下面是CSS
.gameNavigation {
width: 220px;
margin: 0px auto 0px;
}
.button {
margin: 0 0 0 5px;
cursor: pointer;
width: 59px;
height: 29px;
float: left;
text-align: center;
background-color:red;
color: white;
}
.hand {
position:relative;
background-color:transparent;
left:0px;
width:140px;
height:210px;
}
下面是jquery
$(".button").click(function() {
var $button = $(this);
var oldValue = $("#counter").val();
if ($button.text() == "right" ) {
//move right if the value is no more than 4
if(parseInt(oldValue) < 3){
var newVal = parseInt(oldValue) + 1;
$(".hand").animate({
"left": "+=222px"
}, "slow");
$(".coin").animate({
"left": "+=222px"
}, "slow");
//$(".block").stop();
}
}
else {
// move left and don't allow the value below zero
var test = 'test'
if (oldValue >= 1) {
var newVal = parseInt(oldValue) - 1;
}
if(parseInt(newVal) >= -1){
$(".hand").animate({
"left": "-=222px",
easing :'swing'
}, "slow");
$(".coin").animate({
"left": "-=222px",
easing : 'swing'
}, "slow");
}
}
$("#counter").val(newVal);
});