Safari的“位置:固定"在滚动上重叠 [英] Safari "position: fixed" is overlapped on scroll

问题描述

在Safari(Mac)**上，当我在

我知道这是一个非常具体的错误，并且我没有一个最小的示例(因为在Mac VM上进行开发是一场噩梦).但是至少该问题易于访问且易于调试.

感谢您的帮助！

**在我的情况下，带有Safari 12.0.3的macOS mojave 10.14.3

解决方案

这绝对是Safari中的 z-index 订单问题.试试这个CSS:

  .bhooksBookCard {-webkit-transform:translation3d(0,0,0);} 

在Bhooks.com, the cards overlap the footer and the header of the webpage (with position: fixed). So far I'm unable to figure out why and I'm hoping to find some help here.

I also upgraded Bootstrap to the latest version, just to make sure.

Here's a screenshot of the issue:

I know it's a very specific bug and I don't have a small minimal example (because developing on my Mac VM is a nightmare). But at least the problem is easily accessible and easy to debug.

Thanks for your help!

** in my case macOS mojave 10.14.3 with Safari 12.0.3

解决方案

It's definitely a z-index order problem in the Safari. Try this CSS:

.bhooksBookCard {
  -webkit-transform: translate3d(0,0,0);
}

Find this solution in this thread

Please try and let me know if it fixed your problem. Tested in the inspector and seems like it works.

这篇关于Safari的“位置:固定"在滚动上重叠的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！