SIGN UP

Adjust responsive breakpoint from 600px to 968px (mobile view earlier)

By: Jens Westphal | Asked: 02/18/2023
Forums › Category: General questions › Adjust responsive breakpoint from 600px to 968px (mobile view earlier)
0 Vote Up Vote Down
Jens Westphal asked 2 years ago

Hi, We have a multicolumn form that works well on desktop and on mobile because of the resposive  breakpoint @media  600px somewhere in formidable forms.  If you have a smaller Browser window on Desktop or if you are on ipad portrait it looks very ugly. The most simple approch here would be to change that 600px to 968px. can this be done? thanks

1 Answers
0 Vote Up Vote Down
Jens Westphal answered 2 years ago

Hi, after grep thru all plugin files (search media) i found in css/frm_grids.css the following code (with max-wide 750 and 600 )just select your pixel wide 988 in my case and put this into your custom css 

@media only screen and (max-width: 988px) {
        .frm_grid_container.frm_no_grid_750 > div{
                grid-column: span 12/span 12;
        }
}

@media only screen and (max-width: 988px) {
        .frm_section_heading > .frm_form_field,
        .frm_fields_container > .frm_submit,
        .frm_grid_container > .frm_form_field,
        .frm_fields_container > .frm_form_field{
                grid-column: 1 / span 12 !important;
        }

        .frm_grid_container.frm_no_grid_600,
        .frm_form_field.frm_inline_container,
        .frm_form_field.frm_right_container,
        .frm_form_field.frm_left_container{
                display:block;
        }
}

 

Making the Best WordPress Plugin even better - Together

Take on bigger projects with confidence knowing you have access to an entire community of Formidable Experts and Professionals who have your back when the going gets tough. You got this!
Join the community
crossarrow-right