![Check out Enfold](https://kriesi.at/wp-content/themes/kriesi/images/banner-enfold.jpg)
-
AuthorPosts
-
October 8, 2022 at 9:39 pm #1368077
Dear Team,
I don’t achieve finding a way to fix this. On my homepage, after the video (under the slideshow), I have a regular space before a titles underneath that keeps showing in overlay on the video on a smartphone preview. To avoid this, I need to put a padding of 100 which is barely enough to separate it from the title on a smartphone but that is too much for the computer, compared to the other spaces. Is there a way to force a bigger gap only on smartphones ?
Thanks
Best
NatachaOctober 8, 2022 at 9:50 pm #1368078This reply has been marked as private.October 9, 2022 at 8:51 pm #1368165Hi,
Thank you for the link to your pages, for the first one I added this css:@media only screen and (max-width: 767px) { #top.home .hr.avia-builder-el-8 { margin-top: 60%; } }
for the second one, I see that your icons are hidden on mobile but the columns they are in are not so the empty columns take some space, I set the columns to also be hidden on mobile and now there is no extra space.
Best regards,
MikeOctober 9, 2022 at 10:46 pm #1368175Hi Mike,
Thank you for the setting. The overlay is still there. I searched for the code but didn’t find it. I tried to put it in both the cideo and the colum containing it, but nothing changes. Where did you put it ?
Kind regards,
NatachaOctober 9, 2022 at 11:13 pm #1368178Hi,
The code is in the Quick CSS, it looks like you removed the hr that was above the “LIEUX HISTORIQUES BERNE – JURA” the css was set to it.
So now we will use the css on the heading, please add this css to your quick css:@media only screen and (max-width: 767px) { #top.home .av-special-heading.avia-builder-el-9 { margin-top: 60%; } }
After applying the css, please clear your browser cache and check.
Best regards,
MikeOctober 10, 2022 at 3:42 am #1368186Hi Mike,
Thank you for the tip. I’ve noted it.
So now the title is perfectly in its place under the video. But on smartphones, the play button is inactive. I purged the cache, checked in the video settings, and can’t find what’s wrong.
Could you please have a look on this ? Thanks again.
Best regards,
NatachaOctober 10, 2022 at 1:35 pm #1368270Hi,
I found that the margin of the column below the video was overlapping the video, preventing a click on the video, I added this css in your Quick CSS to change the z-index of the video so it is on top, now you can click the video, please clear your browser cache and check.@media only screen and (max-width: 767px) { #top.home .avia-builder-el-5 .avia-video { z-index: 3; position: relative; } #top.home .avia-builder-el-8 { z-index: 0; position: relative; } }
Best regards,
MikeOctober 10, 2022 at 2:47 pm #1368284Hi Mike,
It works now ! Thanks very much for your precious help.
NatachaOctober 10, 2022 at 7:54 pm #1368337Hi,
Glad we were able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.Best regards,
Mike -
AuthorPosts
- The topic ‘Space irregularity in responsive mode’ is closed to new replies.