How to fix style override issues

March 14, 2016


Sometimes if you set up the eventON calendar and if you are not seeing either calendar header or month year showing off sided than how it looks in our demo site, or even eventON settings are not showing for you as they suppose to be — 9 out of 10 times this is causing because of styles in your theme or from another plugin are overriding the styles of eventON.



Step 1:

In chrome or your web browser open the web developer tools (Ctrl+shift+I) in chrome while you have the page with issues open in your browser. Now click on selector button (in chrome)



Step 2:

Having clicked the inspector hover over the item that is in question with your mouse. And find the HTML element in the code that represent that item.


Now look over to the right side for the Styles that applies to this element.

In the above example you can see the display:inline-block is crossed out and its overridden by the theme styles below which has important.


Step 3:

Write a CSS style to override this issue.

Get the class name of style that is overridden in eventON  (in the above example #ajdeEVC_arrange_box p span) you are going to apply css styles to this.

So to fix this style you need a new CSS style that is more powerful than the theme style.

So we will use

#ajdeEVC_arrange_box p span.hide{display:inline-block!important;}


Step 4:

If its a backend issue you will need to write the custom style into the styles for backend. or into functions.php like this



echo “<style>

#ajdeEVC_arrange_box p span.hide{display:inline-block!important;}





If for frontend you can write this style into myeventon > styles


For further CSS customization

override css in your calendar


Did this article help you? If not, send us a ticket via helpdesk

Ready to setup your calendar?

Buy EventON Now