Share Buttons Border Radius Bug On FireFox & IE

• 

  hrhngx · Member · Dec 17, 2014 at 9:02 pm

  • Copy link
  • Add topic to favorites

  Recently, I’ve made the following changes on my sharing buttons successfully and they look clear on Chrome but not responding on my FireFox or IE browsers here…

  .sd-social-icon .sd-content ul li[class*=’share-‘] a, .sd-social-icon .sd-content ul li[class*=’share-‘] a:hover, .sd-social-icon .sd-content ul li[class*=’share-‘] div.option a {
  -webkit-border-radius: 0 !important;
  margin: auto !important;
  text-align: center !important;
  }

  How can I fix/force those changes on FireFox & IE, too?

  The blog I need help with is: (visible only to logged in users)

• 

  thesacredpath · Member · Dec 18, 2014 at 11:23 pm

  • Copy link

  I see you are now using the round buttons.

  -webkit-border-radius only works for webkit based browsers such as Chrome and Safari, and given the wide browser version support for the standard declaration, you really don’t have to use the browser specific versions. Just use
  border-radius: 0 !important;

• 

  hrhngx · Member · Dec 19, 2014 at 6:10 am

  • Copy link

  Now all clear about my sharing buttons thanks to you again, sir!
  I saw “-webkit-” while inspecting my elements on Chrome before the revision and thought that it was a usual/essential keyword to keep there…
  But I’ve just learnt the actual functions and side-effects of “-webkit-” from you here properly…
  Thank you very much again, sir!