.css for Simple Social Sharing plugin

by 5 replies
6
I installed the Simple Social Sharing Plugin, and I really like the way it works, BUT...the .css has it as an unnumbered list, and it looks downright goofy. Here's the code:

}

.simple_socialmedia ul {
list-style-type:none;
margin:0;
padding:5px 0;
}

.simple_socialmedia ul li {
padding: 5px 10px 5px 20px;
line-height:18px;
display:inline;
margin:0;
}

.simple_socialmedia ul li a{
color:#000000;
text-decoration:none;
}

.simple_socialmedia ul li a:hover {text-decoration:none;}

.simple_socialmedia ul li.sharetext {font-weight:bold;padding: 5px 5px 5px 0;}
.simple_socialmedia ul li.twitter {background:url(images/mini_twitter.png) no-repeat left;}
.simple_socialmedia ul li.facebook {background:url(images/mini_facebook.png) no-repeat left;}
.simple_socialmedia ul li.stumble {background:url(images/mini_stumble.png) no-repeat left;}
.simple_socialmedia ul li.digg {background:url(images/mini_digg.png) no-repeat left;}
.simple_socialmedia ul li.delicious {background:url(images/mini_delicious.png) no-repeat left;}

So I don't know how to change it. My .css just isn't that good. I don't like the ul format because it actually puts a bullet in the field.

Any ideas?
#website design #css #plugin #sharing #simple #social
  • If you need to remove bullets from an unordered list (ul) add this to your css:

    You can also style the bullets differently (with your own image) if you don't like dots.
  • Isn't that already in the code?

    • [1] reply

    • True, but since it still gives you bullets, why not use entire ul selector in this case. Or you could add that line of code to each class selector in the style sheet.
      • [1] reply
  • Sounds like you're using Wordpress. I don't deal with Wordpress, however css doesn't discriminate like I do. If you want the bullets gone, add the line of code I gave earlier into the style sheet for your plug-in.

    CSS is all about selectors & style declarations. Classes and ID's. In order to style an element you must first select it.
    .simple_socialmedia ul li <----- is a class type selector which is specific. Since you don't want bullets, adding a new class style declaration of the more universal "ul" will override the specific selector depending on where you put it in the page or style sheet.

    Try it, its very easy.
Join the discussion

Next Topics on Trending Feed