jquery - 使用 safari 的 CSS/JavaScript slider 动画问题

Question

我目前正在为客户构建一个网站，我正在使用来自 this tutorial 的代码

不幸的是，我的客户不允许我发布我当前工作的链接，因为它包含敏感信息。然而，上面是我正在使用的一个清楚的例子。

问题:

我在 slider 上的图像旁边使用文本作为描述。他们目前坐在每张图片旁边，使用边距并有自己的 div。在 Safari 中，此文本会扭曲并超出文本的顶部，并且似乎忽略了我制定的规则并且位于图像顶部或向右移动。我不知道为什么它会这样做并且在其他浏览器中根本不会发生。我已经更改了 java 变量，因此整个容器更大，但这似乎没有什么区别。奇怪的是，在某些情况下，刷新页面时它显示正常，但似乎没有模式，我也没有在时间轴上看到任何奇怪的东西。如果有人可以阐明为什么会发生这种情况，或者可以指出我的方向，那就太好了。客户想在 safari 浏览器上展示 Web 解决方案，不幸的是，我对该浏览器的内部工作原理没有太多经验。

Link to a copy of the work without sensitive information but still has the issue

Answer 1

1. 使用 div#photo
2. 将 css 用于 div#photo div {float:left}
3. #photo 本身必须向左浮动才能以这种水平方式堆叠它们

HTML:

div#album                      {min-width:1000px,min-height:200px}
div#album div                  {float:left,min-width:100px}
div#album div#photo            {min-height:200px}
div#album div#photo div        {float:left}
div#album div#photo div#image  {min-height:200px,min-width:100px}
div#album div#photo div#text   {min-height:50px,min-width:75px}

我给了一个格式，如果你仔细看维度，它显示的是“确保您的文本 div 的高度不超过父级或兄弟级”

我展示的是 child 的宽度和高度应该比 parent 小，因为使用“ float ”时他们会溢出