1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

XF 1.3 Button text alignment

Discussion in 'Styling and Customization Questions' started by AUSL, May 30, 2014.

  1. AUSL

    AUSL New Member

    The text on some of my buttons is aligned to the top of some buttons. (See images below.)

    Here is the extra CSS that I have added for my "Buttons" and "Primary Button" in the Buttons Style Properties:

    Code:
    text-align: center;
    text-transform:uppercase;
    font-weight: 700;
    line-height: 21px;
    display: inline-block;
    cursor: pointer;
    border: 0;
    Any idea how I can fix this?

    wonky_button.png wonky_button2.png wonky_button3.png
     
  2. Russ

    Russ Well-Known Member

    Buttons are picky throughout XF, don't use any padding on the default button and stick to height/line-heights.

    By default XF has a border on the top and bottom so the height is 23px, while the line-height is 2px(1px for the top/bottom border).

    If you want to increase your button height, increase the height/line-height, don't use padding on the top/bottom
     

Share This Page