New Landing › How can we help? › Themeforest Theme Support › Flexform › Arrow breaking on next line on Galaxy S4

Viewing 4 posts - 1 through 4 (of 4 total)
  • Back to forum
    Posted in: Flexform
  • August 28, 2014 at 1:06 am #104748
    markroskowske
    Member
    Post count: 8

    The arrow in the arrow button is breaking onto another line. This happening on a galaxy S4 phone. What CSS changes can I make to keep it all in-line. This is only happening in the chrome mobile browser. Firefox renders the buttons fine on mobile.

    August 28, 2014 at 12:04 pm #104862
    Rui Guerreiro – SUPPORT
    Keymaster
    Post count: 25779

    Hi,

    That’s because that text is to long to fit in the mobile resolution. If we reduce the font-size from 14px to 13px it will work.

    Add the code bellow to your custom css options.

    
a.sf-button.medium{
font-size:13px!important;
}

    -Rui

    August 31, 2014 at 5:08 am #105550
    markroskowske
    Member
    Post count: 8

    This fixed one arrow, but now the shorter one is breaking on chrome on s4. Firefox is fine.

    September 1, 2014 at 6:35 pm #105946
    laranz – SUPPORT
    Member
    Post count: 3186

    Hi,

    Either reduce the font size a pixel down again, by replace the above code with this

    a.sf-button.medium { font-size:12px!important; }

    or reduce the margin between the text and the arrow by this

    a.sf-button .arrow { margin-left: 4px; }

    Let us know,

    Thanks,
    laranz.

  • Back to forum
    Posted in: Flexform
Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in and have valid license to reply to this topic.

License required for one of the following items
Login and Registration Log in · Register