Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • June 29, 2015 at 3:23 pm #465889
    Hotelsolutions

    Hi,

    The Enfold theme offers the option to submit a minimum height of a grid row. As some of the cells will have a background picture, we would like to have the height on mobile much smaller than on desktop. I couldn’t find the correct CSS code to add it with a media query for mobile. How can we decrease the minimum height of the grid row (or preferably even the cell, so we can select the cells with background images to be smaller on mobile and the cells with text stay unchanged) on mobile?

    Thank you!

    June 30, 2015 at 2:06 pm #466418
    Yigit

    Hi Hotelsolutions!

    Can you please post the link to your page and a screenshot showing the changes you would like to make?

    Regards,
    Yigit

    July 1, 2015 at 4:11 pm #467073
    Hotelsolutions

    Hi Yigit,

    Thank your for your reply. I’ve attached the screenshots + further explanation in the private content section!

    July 2, 2015 at 8:22 pm #467745
    Dake

    Hi Hotelsolutions!

    Generally speaking you can apply the media query to .flex_cell.

    For example you can use something similar to the below css in the custom css section in your theme options.

    @media only screen and ( min-width: 600px ){
    .flex_cell {
		min-height: 200px !important;
		max-height: 300px !important;
     }
}

    Or you can be more specific by including the .flex_cell_inner, .av_one_fourth (depends on number of cells) or .avia-builder-el-1 (depends on number of cells) classes.

    Best regards,
    Dake

    • This reply was modified 9 years, 5 months ago by Dake.
    July 5, 2015 at 12:52 pm #468550
    Hotelsolutions

    Thank you Dake, it worked!

    July 6, 2015 at 10:19 am #468756
    Rikard

    Hi!

    Glad we could help :)

    Best regards,
    Rikard

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘Grid row height’ is closed to new replies.