Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • May 15, 2015 at 8:38 pm #445156
    ewingmh

    http://www.gravitygroms.com

    Under the – WE OFFER MANY OPTIONS FOR YOUR GROMS – section you’ll see there are 3 columns each with an iconbox in it – each of these iconboxes is different heights based on their content. I want them all to be the same height. If I set the iconbox to a certain height in pixels it looks good on some screen resolutions – but when the screen size decreases the iconbox content stretches below the iconbox background color. Is there a way to set a standard height that adjusts by screen size?

    height:100% doesn’t work.

    • This topic was modified 9 years, 6 months ago by ewingmh.
    May 18, 2015 at 9:57 am #445549
    Ismael

    Hi ewingmh!

    Thank you for using Enfold.

    Use css media queries to adjust the height of the icon box on different screen sizes.
    https://css-tricks.com/css-media-queries/
    https://css-tricks.com/snippets/css/media-queries-for-standard-devices/

    A few examples of css media queries.

    @media only screen and (min-width: 1140px)  {

}

/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 989px) {
}

/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 989px) {

}

@media only screen and (max-width: 767px) {
  /* Add your Mobile Styles here */

}

    Best regards,
    Ismael

    May 18, 2015 at 5:58 pm #445907
    ewingmh

    so percentages won’t work?

    May 20, 2015 at 8:40 am #446981
    Ismael

    Hi!

    No, percentage will not not work because the grid row’s display is set to table and the height is not specified to keep it responsive. 

    div#av-layout-grid-1 {
  height: 1070px;
}

    Your best chance is the css media query or creating a dynamic javascript. Something like this: http://www.zyxware.com/articles/2545/jquery-set-the-height-of-one-div-to-another-div

    Best regards,
    Ismael

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.