[Support request] Conflicting extensions

[Matthieu]

Hello, I need help! 😅

I use the Happyform extension and the responsive accordion extension. Yesterday suddenly posting these two extensions on my page is not good. Why when I go to the extensions settings nothing to change.

Could you maybe help me find where there is a problem ?

Thanks

If below, the page in question with the use of the two extentions:

[David]

Hi there,

what exactly is the issue ?

[Matthieu]

So some tests it is in fact the css code for the display of the images in the cart on mobile which causes that the display of my extentions on a computer does not work.

here is the code :

@media(max-width: 768px) {

/* reduce space between cart title and content */
.woocommerce-checkout .entry-content {
margin-top: 0.5em;
}

/* Display thumbnail align right of remove button */
.woocommerce-page table.cart .product-thumbnail {
display: block !important;
}

.woocommerce-page table.cart .product-thumbnail:before {
display: none;
}

.woocommerce-page table.cart .product-remove {
float: left;
border-bottom: 0;
}

[Leo]

Still not quite sure what the issue is.

Where can we see it in the linked page?

[Matthieu]

Hello, in a previous post you provided me with this css code to display the image of the item in the cart page on the phone. Except that this css code to modify the appearance of my contact form (happyform extension) as well as my accordion (responsive accordion extension).

I just wanted to know if there was an alternative to display the image of an item in the cart without it changing the appearance of my extensions.

[Leo]

I don’t see how that CSS could cause the issue – it doesn’t have the selectors to change HappyForms.

[Matthieu]

Hello, yet when I put the css code, it changes the appearance of the contact form as well as the FAQ. And when I remove this css code, the appearance of my items returns to normal.

[Leo]

That is just not possible.

The selectors in that CSS is using .woocommerce-checkout and .woocommerce-page and those classes don’t exist on the linked page:
https://www.screencast.com/t/vbeo3FUrNKkf

Perhaps there is some sort of a syntax error going on in your CSS?

For example, your CSS above is missing a closing } for the @media (max-width: 768px) {.

[Author]

Posts