I'm trying to style a command link as a command button and I have the code for this,

<apex:commandlink value="Add new Contact" action="{!editNewCont}" styleclass="btn MyBtn">

and my CSS goes like this,


But for some reason the MyBtn properties (padding is not applied correctly). How do I do this? Also, is there way I could give the "btn" property as part of the CSS so that my styleclass would be like this,

styleclass="MyBtn" instead of styleclass="btn MyBtn"

Please advise.

  • Is there a reason you can't just use an <apex:commandButton>?
    – Mark Pond
    Commented Jul 16, 2015 at 15:22
  • Mark, I'm not able to use Command button since I have to pass an apex:parm and it doesn't like apex:commandButtons
    – JJSHHS
    Commented Jul 16, 2015 at 17:53
  • 1
    If you don't get your CSS inheritance issue squared away, there's some well-known workarounds to allow you to use the <apex:param> tag with a command button. help.salesforce.com/apex/HTViewSolution?id=000002664
    – Mark Pond
    Commented Jul 16, 2015 at 18:03
  • Mark, that did it. Thanks for sharing this workaround. Is there a way to flag your comment as the 'answer', that would help others like me.
    – JJSHHS
    Commented Jul 16, 2015 at 18:25
  • Hey @JJSHHS have you tried with .MyBtn{text-decoration:none;padding:4px !important ;}
    – Ratan Paul
    Commented Nov 26, 2015 at 7:57

2 Answers 2


I can't tell you why the padding isn't being applied without seeing your page, but I suggest that you check to see whether the styling is being overridden by another element; you can do this using the Developer Console.

With regard to your second point, you would need to copy the definition for btn into MyBtn - but if btn is a Salesforce-defined class, this is not a good idea (as your copy may become outdated with future updates to Salesforce).

  • I believe the default salesforce style btn overrides the MyBtn styling. Is there anyway to prevent that?
    – JJSHHS
    Commented Jul 16, 2015 at 17:56
  • JJSHHS, you'll need to change the MyBtn styling to take precedence over the .btn styling. You can use CSS specificity to do this. See smashingmagazine.com/2007/07/27/…
    – Rob
    Commented Jul 16, 2015 at 18:00

Try adding !important next to your padding attribute, like padding: 4px !important;, in your CSS tag.

If it doesn't work, then why not just use the style attribute of the commandLink? You can put the padding in there too (but it will only be applied to that specific link).

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .