Viewing 9 replies - 1 through 9 (of 9 total)
  • Plugin Contributor Ron Rennick

    (@wpmuguru)

    The dot is there for the widget which is also a list item ( and not for the icon ). By default list items have said dots. Your theme does not disable it globally (or globally for widgets).

    Thread Starter Stevedawg

    (@stevedawg)

    I see there is this css:

    .simple-social-icons ul li {list-style-type:none;}

    But does it need to be:

    .simple-social-icons ul li a {list-style-type:none;}

    Plugin Contributor Ron Rennick

    (@wpmuguru)

    Yes, that CSS is for the UL & LI inside the widget.

    The dot is there for the widget which is also a list item

    You need to target the UL/LI wrapper for the widget area.

    I’m trying to post the icons in my header. They work just fine everywhere else, but not the header. Using GymBase Theme updated with child theme.

    Thread Starter Stevedawg

    (@stevedawg)

    Here’s the css I’ve add and still have the dot?

    .socialMedia ul li {
    	list-style-type:none;
    }
    
    .socialMedia .widget ul li {
    	list-style-type:none;
    }
    
    .widget ul li {
    	list-style-type:none;
    }
    
    .simple-social-icons ul {
    	list-style-type:none;
    }
    
    .simple-social-icons ul.aligncenter {
    	list-style-type:none;
    }
    
    .simple-social-icons ul.aligncenter li {
    	list-style-type:none;
    }
    
    li.social-facebook {
    	list-style-type:none;
    }
    
    ul.aligncenter {
    	list-style-type:none;
    }
    Plugin Contributor Ron Rennick

    (@wpmuguru)

    You still are not targeting the widget area. The widget area is the html markup that wraps the widget area.

    Thread Starter Stevedawg

    (@stevedawg)

    Tried this

    .widget ul {
    list-style-type:none;
    }
    .widget .simple-social-icons ul {
    list-style-type:none;
    }

    .socialMedia .widget .simple-social-icons ul {
    list-style-type:none;
    }

    Plugin Contributor Ron Rennick

    (@wpmuguru)

    Assuming this is the correct selector

    .socialMedia .widget .simple-social-icons ul {
    list-style-type:none;
    }

    try adding

    .socialMedia .widget {
    list-style-type:none;
    }
    Thread Starter Stevedawg

    (@stevedawg)

    Thanks for your help. The thing that actually worked was

    .socialMedia {
         list-style:none;
         overflow:hidden;
    }
Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Icons have dot next to them’ is closed to new replies.