Issue with using CSS on Iconic Icons in WordPress Theme.

I would like to customize Ionicon using the css in Sequential WordPress theme. Iconic Icons was not originally in the theme. So I added by putting this code in functions.php.

add_action( 'wp_enqueue_scripts', 'bg_enqueue_ionicons' );
  function bg_enqueue_ionicons() {
   wp_enqueue_style( 'ionicons', 
   '//', array());

Then placing this code into footer.php. I would like to place the icon directly into footer without using widgets.

 <p class="social-icons">
   <a href=""><i class="ion-social-linkedin-outline"></i></a>
   <a href=""><i class="icon ion-social-facebook"></i></a>
   <a href=""><i class="icon ion-social-instagram-outline"></i></a>
   <a href=""><i class="icon ion-social-dribbble-outline"></i></a>

Finally adding the css, to make it look good. (Issue Here) {
    border: 1px solid #949792;
    border-radius: 50%;
    color: red;
    display: inline-block;
    height: 42px;
    margin-left: 10px;
    margin-right: 10px;
    padding: 10px;
    width: 42px;
} a:hover {
    border: 1px solid #fff;
    color: red;

The icons will show but for some reason, the CSS will not apply. Does anybody have a fix for this?

Read more here: Issue with using CSS on Iconic Icons in WordPress Theme.

Leave a Reply

Your email address will not be published. Required fields are marked *