Forum Discussion

BuildPro's avatar
BuildPro
Qrew Captain
3 years ago

Text not centered on button

Please fix this so that the text is smaller and centered on the button.  I have tried so many different ways...nothing is working. thank you
ths
// Begin button style
var text bgcolor = $ButtonColor;
var text txtcolor = $WordsColor;
var text style = "style=\"text-decoration: none; text-align: center; background:" & $bgcolor & "; width: 20px; height: 20px; border-radius: 20px; padding:5px 5px 5px 5px; color: " & $txtcolor & "; display: inline-block; font: normal 10 6px/1 \"Calibri\", sans-serif; text-shadow: none;";
// End button style

------------------------------
BuildPro
------------------------------
Formulas and functions
  • LauraThacker_ID's avatar
    LauraThacker_ID
    Qrew Trainee
    3 years ago
    How do you like this?

    text-align: center; padding:5px 5px 5px 5px; background:" & $bgcolor & "; border-radius: 20px;color: " & $txtcolor & "; display: block;

    I tried a few different options and none seemed very close.  I do not think you can use the fixed-width because of the size/amount of text.

    ------------------------------
    Laura Thacker IDS
    ------------------------------
    • BuildPro's avatar
      BuildPro
      Qrew Captain
      3 years ago
      Here's the first part of the formula.  Do these details change anything on your formula? Just thought I would check before using yours.  thx

      ------------------------------
      BuildPro
      ------------------------------
    • BuildPro's avatar
      BuildPro
      Qrew Captain
      3 years ago
      This worked, but I am looking for a round button with smaller font size. This what your formula does.It has been a chllenge for sure!

      ------------------------------
      BuildPro
      ------------------------------
      • LauraThacker_ID's avatar
        LauraThacker_ID
        Qrew Trainee
        3 years ago
        You might be better off using a button-generator (dabuttonfactory) that you can design/color text/size the way you want and then use those as images in your formula which you can tie into a button if a user needs to click on it to action something.

        I am struggling getting your text centered across the circular button.  If I get a solution; i'll post back.

        Best I got is:   
        var text style = "height: 40px; width: 40px; vertical-align: center; text-align: center; padding:5px 5px 5px 5px; background:" & $bgcolor & "; border-radius: 20px;color: " & $txtcolor & "; display: block;";

        ------------------------------
        Laura Thacker IDS
        ------------------------------