Padding for Text on Button

Hi,

I am googling like a mad-man trying to find how to change the inside padding on a button in the dashboard. I know you can do som magic with style sheets in a templete node, but I cannot find the right thing to change.
Looking at the image I am trying to get a bit of margin between the numbers and the edge of the button. Maybe it would be nice to also get a bit more white around the button to make it differ a bit more from the background image.
Pointers in the right direction would be much appreciated.

It will be easier to suggest improvements if you share the code used in your template node.

There is nothing to share I am afraid, as I have yet found what to put in the template node regarding the buttons.
At the moment the only thing in there is setting the background image, but that is not related to my question about the buttons.

I Have now found that it is the .md-button that I need to change the style of. When I set the 2px black border it workes. But when I try padding or margin it gives no results.

<style>
body {background-image: url("/LOGO.JPG"); background-repeat: no-repeat; background-attachment: fixed; background-position: center;}
.nr-dashboard-text {border: black 2px solid;}
.md-button {border: black 2px solid; padding: 10px;}
</style>

What am I doing wrong?

A template like this works for me...

<span class="foo">1.Words</span>
<style>
.foo {
    border: black 4px solid; 
    padding: 10px;
}
</style>

That works for me to, but not on the dashboard button.

This is what I try on the Button. The 2px black border works but the padding does not.

<style>
.md-button {border: black 2px solid; padding: 10px;}
</style>

sorry I was confused as the default button is center aligned...
image
Wherever you have changed that is where you need to change

Thats my bad, Sorry... I see now how that can be confusing. The left align is done by html in the node label in the editor. But I have now changed that over to the css sicne I found what element to set it in.

<style>
.md-button {border: black 2px solid; text-align: left; font-size: 35px; padding: 10px;}
</style>

Font size works, text alignment works, border works but the padding do not work.... I do not understand.

Thanks for trying to help me. Probably I am missing something obvius.

The default style tries to set it so you need to force it with !important

 padding-left: 10px !important;}

dceejay, Thank you! That was it.
In my mind the css that I put in the template was the lowest one and should therefore be used. As CSS are just that, cascading. But now I have learnt something new.

Cheers
Tobbe

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.