How to fix style override issues

Cause: 

Sometimes if you set up the EventON calendar, you might notice that the styles are a bit off. For example, the header or months might be misaligned or different from the demo site. The most common cause of this is style conflicts with your theme.

Solution:

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 the inspector 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 represents 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 is overridden by the theme styles below which has important.

Step 3:

Write a CSS style to override this issue.

Get the class name of the 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 the backend. or into functions.php like this

if(is_admin()):

echo "<style>

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

</style>";

endif;

If you are targeting the frontend you can write this style into EventON > Styles field.

For further CSS customization

override css in your calendar