I have a problem with my site. Inside the editor everything works just fine and even when I go toggle preview it shows as it suppose to show. But when you try to see the published it messed up.
I’m talking about the offers that I have there, you can see them on the home page scrolling down, after the main dashboard, the area is called “Lo destacado”. And also I have the same offers on the trading floor area that you can get there by clicking on trading floor, on the dashboard or by clicking on the shopping mall car on the top bar. The first three offers that I have are the ones with the effects. And those are the ones that messed up but they are shown correctly on the editor en toggle preview.
The structure of your element is a bit complex and I see why: the hidden text has to be part of the link who get the :hover interaction in oder for the interaction effect to sustain while the cursor leaves the images and goes over the text/link.
So this complicate structure ends up bugging once publish, so change it:
Break down the whole element in two divs inside a parent one: first div contains everything but the heart icon and price, the second contains heart icon and price. Now you can give the hover interaction to the whole upper div, and let the structure of elements almost the same way they are in the following blocks (the one with no interaction and hidden text yet), with less nested elements.