[How To] Change CSS / Find CSS class of an element

How To Make Custom CSS Changes

The chrome browser inspector is a browser feature that allows you to view specific HTML elements and their CSS class.  You can isolate specific elements or tags and view the corresponding CSS styles to easily change the CSS and copy the code for customizations.

Just open your Website in Google Chrome and right-click on the element you want to customize. Now choose “Inspect Element”  and you will see the class of the elemen. You can use that class to add your customizations to either the Custom CSS field in the Theme Options or in your child theme. You can also find the corresponding CSS file that is responsible for the elements style if you want to hard code any changes.

You can then use the CSS class of the element to add your CSS changes. For example

1	.myclass{color: #ff0000; background-color:#00ffff;}

To overwrite CSS classes, you can use the !important attribute

1	.myclass{color: #ff0000 !important; background-color:#00ffff !important;}

For more informations check out the following link: https://developer.chrome.com/devtools/docs/dom-and-styles

Ticket