Forced Content Box Height - by topimr - on WordPress WooCommerce support

This topic has 8 replies, 3 voices, and was last updated 7 years, 4 months ago ago by Laranz

  • Avatar: topimr
    topimr
    Participant
    July 12, 2017 at 06:09

    Good evening and thank you for your help. I am trying to make content boxes in a row be the same height. But I also want them the same height when it switches to the tablet view. I am able to do one or the other. I can’t get tie @media to work. Can you tell me what I am doing wrong? I put them in a .ftr-boxes row class.

    The boxes are at the bottom of every page.

    Thank you!!

    .ftr-boxes div.ult-content-box {min-height: 315px !important;}

    @media only screen and (max-width: 768px) {
    .ftr-boxes div.ult-content-box {min-height: 390px;
    }
    }

    7 Answers
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    July 13, 2017 at 09:08

    Hello,

    Sorry for the delay.
    Please thy this option http://prntscr.com/fv3qne if it won’t help, provide wp-admin access in Private Content.

    Regards

    Avatar: topimr
    topimr
    Participant
    July 19, 2017 at 20:44

    I am so sorry for the delay in responding. Thank you for the help.

    Yes the equal height box was checked but that makes the columns in the row the same height and not the info boxes. I can force the boxes to be the same height but I need the forced height to be different when it goes to tablet media.

    Look at the image below in the private area. I was able to get the height to be the same for all three boxes with the code above. My problem is that I can’t get it to change for the @media call for tablets. I need the min-height to change to be 390px when viewing on a tablet but the code I have above isn’t working.

    What am i doing wrong?

    Please, contact administrator
    for this information.
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    July 20, 2017 at 09:19

    In this case, try to add !important; http://prntscr.com/fxyvkv

    Regards

    Avatar: topimr
    topimr
    Participant
    July 20, 2017 at 20:56

    Thank you for the response but that didn’t quite work.

    I did that and now it is always 390px. We need it to be 390px for tablets and then 315px for regular computer monitors please.

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    July 21, 2017 at 08:06

    In this case change your media query:

    @media (max-width: 1200px) and (min-width: 768px) { 
       .ftr-boxes div.ult-content-box {
          min-height: 390px !important;
    }
    }

    Regards

    Avatar: topimr
    topimr
    Participant
    July 21, 2017 at 17:13

    Yay that worked! Thanks

    Avatar: laranz
    Laranz
    Participant
    July 24, 2017 at 05:42

    Hi,

    Glad we helped. 🙂

    Let us know if you have any other questions,

    Thanks,
    laranz.

  • Viewing 8 results - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.Log in/Sign up

8theme customization service
We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.