Slider Revolution issues recently appearing

[redlabelstudio]

My web developer was able to find the issue is due to the Apple Pay element being hidden. He added the following custom CSS:

#wcpay-payment-request-wrapper {
width: 30%;
padding: 0px !important;
}

#wcpay-payment-request-button-separator {
padding-left: 5px;
padding-right: 5px;
margin-top: 1em !important;
}

However, when viewing the website on mobile or other narrow screens, the elements stack strangely. Do you know how he might be able to stack the elements nicely, or have the items change their dimension in relation to the size of the scree it is being viewing at so that it appears nicely?

Here is a screenshot showing what I mean:

You can see that the “Add to Cart” button appears below the “Apple Pay” button.

[Supporter]

Please add this custom CSS to the file style.css:

@media only screen and (max-width: 768px) {
 #wcpay-payment-request-wrapper {
  width: 100%;
 }
}

• This reply was modified 2 years, 3 months ago by Supporter.

[redlabelstudio]

Thank you for that! Seems to have done the trick 😉

[Author]

Posts