Return to previous page

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

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

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;
}
}

#167674 Copied

7 Answers

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

#167806 Copied

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.

#168403 Copied

Rose Tyler

Support staff

July 20, 2017 at 09:19

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

Regards

#168434 Copied

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.

#168493 Copied
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
#168509 Copied
topimr

Participant

July 21, 2017 at 17:13

Yay that worked! Thanks

#168565 Copied

Laranz

Participant

July 24, 2017 at 05:42

Hi,

Glad we helped. 🙂

Let us know if you have any other questions,

Thanks,
laranz.

#168598 Copied
Viewing 8 results - 1 through 8 (of 8 total)