Home › Forums › Themes Support › Claue › Hero banner not mobile responsive
- This topic has 7 replies, 2 voices, and was last updated 3 years, 7 months ago by Harry.
-
AuthorPosts
-
-
September 21, 2020 at 4:23 pm #38586DonnaJackySupport Expired
Dear,
Last time the hero banner wasn’t mobile responsive and now we add another hero banner, but this one is also not mobile responsive. How can we make it responsive and make sure the next hero banners will be mobile responsive? Thanks!
Attachments:
You must be logged in to view attached files. -
September 21, 2020 at 4:57 pm #38589HarrySupport Expired
Hi Jacky,
The issue because you add padding top and padding bottom of and these value fixed while background cover content and when you view on mobile only the width decrease but the height still the same so you have to add code to decrease the height.
Please add below code to Claue > Theme Option > General layout > Custom CSS
@media only screen and (max-width: 767px) { .vc_custom_1600637582830 { padding-top: 25vh !important; padding-bottom: 5vh !important; }}
We recommend just change the background image. Don’t delete the row wrap hero banner and create new row.
Kind regards
Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio -
September 21, 2020 at 5:09 pm #38590DonnaJackySupport Expired
Hi Harry,
Thank you!
I just added the code, but the hero banner isn’t changing.
-
September 21, 2020 at 6:45 pm #38591HarrySupport Expired
Hi Jacky,
Please change code to
@media only screen and (max-width: 767px) { .vc_row..vc_custom_1600637582830 { padding-top: 25vh !important; padding-bottom: 5vh !important; }}
Kind regards
Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio -
September 21, 2020 at 7:31 pm #38594DonnaJackySupport Expired
Dear Harry,
Thank you.
Maybe you can took a look, because it is still not working.
-
September 21, 2020 at 11:20 pm #38603HarrySupport Expired
I’m sorry again.
The correct code is
@media only screen and (max-width: 767px) { .vc_row.vc_custom_1600637582830 { padding-top: 25vh !important; padding-bottom: 5vh !important; }}
Kind regards
Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio -
September 22, 2020 at 5:33 pm #38624DonnaJackySupport Expired
Dear Harry,
Sorry to say, but this code isn’t also working ?
-
September 22, 2020 at 7:43 pm #38625HarrySupport Expired
Hi Jacky,
Please check the number https://prnt.sc/ulslw5 it different with old code https://prnt.sc/ulsmwz
Please use the new on this topic.
Kind regards
Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio
-
-
AuthorPosts
You must be logged in to reply to this topic.