Responsive style

  • Upwardchurch
    Asked on April 20, 2015 at 1:31 PM

    So I have made a simple form that I have styled.

    But I have noticed that on the mobile version that some of the text styles are different. 

    And I can't find a way to adjust them in the designer. 

  • BJoanna
    Replied on April 20, 2015 at 3:01 PM

    Are you referring to this, when you say that the text styles are different on mobile?

    Responsive style Image 1 Screenshot 40

    You can change that by Injecting Custom CSS. To do that inside of your Form Builder select Setup & Embed tab, then click on Preferences, then select Form Styles tab and inside of Inject Custom CSS field at the bottom of existing code paste this code:

    @media screen and (min-width: 10px) and (max-width: 480px){

    .form-header{

    font-weight : bold!important;

    }}

    @media screen and (min-width: 480px) and (max-width: 720px){

    .form-header{

    font-weight : bold!important;

    }}

    Responsive style Image 2 Screenshot 51

    After adding this code your form will look like this.

    Responsive style Image 3 Screenshot 62

    Hope this will help. Let us know if you need further assistance.