Support » Plugin: SMS Alert Order Notifications - WooCommerce » CSS conflict with all buttons

  • Resolved Anand Upadhyay



    Your plugin is loading sms-alert.css file on the frontend. In that file, there is a rule which is targeting all elements with the class button.

    .button {
        position: relative;
        border: none;
        outline: 0;
        cursor: pointer;

    .button is a common class used by themes and woocommerce. And it is conflicting other such elements by removing the border or all buttons on the site.

    You should be adding your plugin’s specific suffix to the class and use that in your CSS rule to get rid of such conflicts.

    In my case, I am using blocksy theme with WooCommerce.

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author Cozy Vision


    Thank you for contacting us.

    We can understand your point, but before we could modify it we would like to see exactly where it is creating issue.

    As we checked with blocksy theme, but could not find any conflict, as css from blocksy theme was overriding our css.

    We would request you to share the url of the page where its conflicting.

    You can either send the url here or you can email us at

    Thread Starter Anand Upadhyay


    I have fixed the issue with my custom CSS rule but you can check it happening here

    One more point to add, I am using WPRocket with minify CSS and optimize CSS delivery enabled. It is happening after that.

    I think by just replacing generic button class with a different CSS specifier unique to your plugin can resolve such conflicts.

    Plugin Author Cozy Vision


    Thank you for sharing the details.

    We have fixed this in our upcoming version, which would be live in next few days.

Viewing 3 replies - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.