如果您进入游戏结束屏幕(它是井字游戏,所以不会花很长时间),在 chrome 中,叠加层适合棋盘。但在 Firefox 3 中,叠加层向下移动了几个像素。
如何更改我的 CSS 以使其更加一致?
最佳答案
你定位 .overlay_container 有很多技巧(负边距),你应该把它放在 .board 里面,它有绝对位置,然后添加:
.overlay_container {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
}
这确保位置匹配所有浏览器,并且如果板尺寸发生变化,叠加层将适应它。
这是一个精简到最低限度的演示 http://jsfiddle.net/duopixel/qYejG/
关于CSS:叠加层在 Chrome 上看起来不错,但在 Firefox 3 中却不行:如何修复垂直偏移?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4918938/