Make text act as buttons custom character sheet

this has probably been asked before but how do you make text work as buttons to do rolls in a custom character sheet. I am trying to limit space used and the button graphic is not needed for my sheet. Sorry if dumb question but need help and can not find it anywhere.

you just have to style the button to remove the default dice icon, and to make the borders and background transparent, and then just have some text in the button. Take a look at my Stargate sheet for an example: <button name="roll_str" type="roll" value="/r 1d20+@{str_mod}" class="txt-btn large">STR</button> button[type="roll"].sheet-txt-btn:before{ content: ' '; } button[type="roll"].sheet-txt-btn{ height: 22px; border-style: none; background-color: transparent; margin-left: 5px; font-weight: bold; padding: 2px 5px 4px 5px; } button[type="roll"].sheet-txt-btn:hover{ background-color: #d9d9d9; border-radius: 10px; } Then you just need to reduce the margin, padding and font-size of the button to make it small enough for your taste. The wiki has an section that shows how to change the default dice by overriding it.

Thank you. I am learning css as I go. I have done most from watching videos and searching forums. I am glad there are people like you to help out when new coders get stuck.

You should read the roll20 documentation , and general html/css documentation. The CSS Wizardry shows a number of tricks to make a few things in Roll20 that isn't completely standard html/css(as some things need to be done withing the restrictions we have with how the sheet works).

I'm having some trouble with this - everything seems fine in the Preview window but when I go to play this happens:  <div class="divTableCell"><button name="roll_trust" type="roll" value="[[(@{Trust}+?{Bonus Dice|0})d6>4]]" class="txt-btn large">TRUST</button></div> button[type="roll"].sheet-txt-btn:before{ content: ' '; } button[type="roll"].sheet-txt-btn{ height: 20px; border-style: none; background-color: transparent; margin-left: 5px; font-family: "Rubik", Arial; font-style: italic; font-size: .8em; font-weight: bold; color: #ffffff; padding: 5px 0px 0px 0px; } button[type="roll"].sheet-txt-btn:hover{ border-style: none; background-color: transparent; }