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

Fixed Call to action button is missing vertical align

Discussion in 'Resolved Bug Reports' started by CyberAP, Apr 8, 2014.

  1. CyberAP

    CyberAP Well-Known Member

    Call to action button is 1px down from where it should be. That's because of vertical alignment used in inline blocks. To fix this we just need to add vertical-align: top;

    Before: call2act1.PNG After: call2act2.PNG
  2. imthebest

    imthebest Formerly Super120

    Quite perfectionist guy! :D
  3. Liam W

    Liam W Well-Known Member

    It took me a whole minute to see the difference :p

    Looks better though, it'll annoy me until it's fixed now!
  4. CyberAP

    CyberAP Well-Known Member

    Once it's seen it cannot be unseen :D
    Jay, Bartholomeus and Steve F like this.
  5. Kier

    Kier XenForo Developer Staff Member

    I've tried attaching vertical-align:top to a.callToAction and I can't actually see it making a difference - what browser does your screenshot come from, and have you attached the CSS rule to an element other than a.callToAction?
  6. CyberAP

    CyberAP Well-Known Member

    It's latest Chrome on Windows 8. I've made changes only to a.callToAction.
  7. Kier

    Kier XenForo Developer Staff Member

    Interestingly, I can see it making a difference under Chrome on Windows 7, but it makes no difference whatsoever under Chrome on Mac.

    I'll make the change anyway, as it seems to be for the better.
  8. Nobita.Kun

    Nobita.Kun Well-Known Member

    I can confirm that on Google Chrome Windows 8.1 :)
  9. CyberAP

    CyberAP Well-Known Member

    Probably on Mac you have different baseline. Anyway, it's best to always set vertical align for inline blocks.

Share This Page