浮动div调整大小时奇怪的背景剪切行为

时间:2012-01-16 01:22:44

标签: html css background

HTML页面有一个背景图片。左侧的导航菜单在悬停时展开以显示元素。菜单具有透明背景。

当菜单增长时,剪辑背景图像并将其向下移动到菜单后面的页面。

将其缩小为:http://jsfiddle.net/GgXXh/

背景剪辑是我不理解的预期行为,还是浏览器错误(Firefox 9)?

似乎需要设置正文overflow-y: scroll并触发菜单float: left

1 个答案:

答案 0 :(得分:1)

真的看起来像FF bug。与FF 7一起再现。 在身体上也没有overflow-y: scroll的情况下再现。

在Chrome上效果很好。

background-position更改为top center会修复裁剪并向下移动背景:

http://jsfiddle.net/GgXXh/8/