CSS将浮动元素移动到另一个位置

Question

我有一个使用WooCommerce和名为Extra Product Options的插件的基于wordpress的网站。有了这个插件，除了有额外的选项，我在左下角有一个浮动框显示选定的选项。

Link to product page

是否有可能通过CSS从左下角移动浮动框固定在产品图片下方？

除非屏幕较小的人正在使用它，否则当前位置可以完美工作，因为浮动框覆盖了某些其他产品图像和显示在按钮上的信息。

如果这太复杂了，有没有其他建议解决这个问题？所有的建议非常appriciated！提前致谢！

在CSS

Answer 1

找到.tm浮箱，并设置位置从固定到相对

这是你有什么

.tm-floating-box { 
    width: auto; 
    height: auto; 
    padding: 1em; 
    position: fixed; 
    right: 0; 
    top: 0; 
    bottom: 0; 
    left: 0; 
    background: url("../images/p5.png") repeat scroll 0 0 transparent; 
    z-index: 9999; 
    max-height: 100%; 
    overflow: hidden 
} 

这是你想要将其更改为

什么

.tm-floating-box { 
    width: auto; 
    height: auto; 
    padding: 1em; 
    position: relative; 
    right: 0; 
    top: 0; 
    bottom: 0; 
    left: 0; 
    background: url("../images/p5.png") repeat scroll 0 0 transparent; 
    z-index: 9999; 
    max-height: 100%; 
    overflow: hidden 
} 

它可能不会把它放在图像下面，但它会阻止它流动并将它粘在左边。