【问题标题】:Why are my images truncated when cursor is hover it after a scale (1.5) effect?为什么在缩放(1.5)效果后光标悬停时我的图像会被截断?
【发布时间】:2021-07-28 20:01:18
【问题描述】:

我们有一个在线课程平台。我们使用带有 Eduma 主题和 Learnpress 插件的 Wordpress 5。

我正在尝试在我的课程缩略图上制作 netflix 效果。

我成功做到了,但是在第一行课程中,图像被截断了。

我尝试制作最少的代码来重现问题并将其粘贴到此处,但是来自主题和不同插件的 css 太多。不可能留下一些最低限度的代码。

您可以在https://formatine.com/主页的课程行中看到问题。将光标悬停在课程中,您将看到缩放效果。

第二行没问题,但第一行有问题。

我尝试更改父容器的 css,因为我认为嵌套的东西会影响效果。 我在不同的 div 上尝试了一些 z-index,但没有奏效。

经过几天的调查,我来到这里看看是否有人知道我做错了什么。

请帮忙。

【问题讨论】:

  • 这是因为.thim-course-grid 应用了overflow: hidden
  • 是的,和我发现的一样,现在图像不会被截断。但是在悬停时,第二行中的元素也会前后移动。

标签: html css wordpress


【解决方案1】:

经过研究,我能找到的是:

有一个overflow: hidden 应用于类名为thim-course-grid 的父div 之一。

删除它会解决问题。

你能检查和更新吗?

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2013-04-18
    • 1970-01-01
    • 2015-06-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-12-09
    • 2021-05-21
    相关资源
    最近更新 更多