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

Fixed Text inside button not centered properly

Discussion in 'Resolved Bug Reports' started by Luxus, Jan 16, 2014.

  1. Luxus

    Luxus Well-Known Member

    If you open a report, you will see this small button:


    The text inside this button has a wrong line-height. It isn't consistent with other similar buttons. I have found that a line-height of 20px would center it properly.
  2. Brogan

    Brogan XenForo Moderator Staff Member

    It's using the same .button class as the buttons below the editor, which also have a line height of 23px.

    Are those buttons also not vertically centred for you?
  3. Luxus

    Luxus Well-Known Member

    No, they are fine. Also note that I was using the untouched default style.
  4. Brogan

    Brogan XenForo Moderator Staff Member

    Ah, it appears to be specific to Firefox.
    Chrome is fine.
  5. Mike

    Mike XenForo Developer Staff Member

    Firefox has a long standing line-height bug (open since 2001 I think) that relates to mixing <a>, <button> and <input>. It's possible that's rearing its head here.
  6. Luxus

    Luxus Well-Known Member

    Yeah it appears it's really a firefox bug. For now this seems to fix it:

    @-moz-document url-prefix() {
    	.report_view .actionList .button
    		line-height: 20px;
  7. Mike

    Mike XenForo Developer Staff Member

    I think the proper line-height is actually 21px, since we use border-box sizing with a 1px border and a height of 23px. I've played around with this and it doesn't appear to change anything visually aside from this case.

    As such, I'm making this change for 1.3. I'm not 100% confident that it won't change something unexpectedly, so best to run though beta.

Share This Page