checkout-page.css bad practice with !important

For people using CheckoutWC plugin, you may encounter a conflict with CSS and the phone input field due to bad practice of the developpers of Up2pay plugin.

Here the explanations:

The problem comes from the fact that the Up2Pay plugin is using the exact same front end library for international telephone input.

The core problem is the developers of Up2Pay are not following the best practices of CSS, leading to this type of markup and layout conflicts on a WordPress site where multiple plugins each bringing their own CSS clash for space on the same page.

For this very specific case, the Up2Pay plugin developers are shipping CSS with the important flag that is taking priority over anything else, and causing the shrunken input you see to be styled by them, no matter the CheckoutWC default styling.

Please take a look at the !important flag documentation by the Mozilla Developer Network:?https://developer.mozilla.org/en-US/docs/Web/CSS/important. It’s usage is primarily?not recommended?to prevent this type of problems overriding others code.

• This topic was modified 4 months, 1 week ago by tbo460.