我正在努力解决我网站上的这个悬停问题。每当我翻阅产品时,产品描述都会显示在其下方,我终生无法弄清楚如何修复它:
它使用的是有感知的主题,但是在 firebug 花了一些时间试图深入研究 css 之后,我仍然无法弄清楚如何移动产品描述以使其显示在图像的顶部而不是图像的下方。
任何帮助是极大的赞赏。谢谢!
我正在努力解决我网站上的这个悬停问题。每当我翻阅产品时,产品描述都会显示在其下方,我终生无法弄清楚如何修复它:
它使用的是有感知的主题,但是在 firebug 花了一些时间试图深入研究 css 之后,我仍然无法弄清楚如何移动产品描述以使其显示在图像的顶部而不是图像的下方。
任何帮助是极大的赞赏。谢谢!
我认为这应该适合你:
// removes img from the flow, so doesn't push other elements down:
.product > img{position:absolute;z-index:1}
//on hover, give the other elements positioning & z-index
// so they're not hidden by the image:
.product:hover h3,
.product:hover .amount,
.product:hover .excerpt,
.product:hover .button add_to_cart_button product_type_simple
{position:relative;z-index:2}