Home › Forums › All Other Themes › Agency theme homepage slider
- This topic has 8 replies, 2 voices, and was last updated 4 years, 2 months ago by Sonl Sinha.
-
AuthorPosts
-
August 24, 2020 at 7:57 am #159817
Hi,
I’m using your Agency theme for my website and wanted to ask how I can have the homepage slider images fill the screen on mobile? Right now they fill the screen on a desktop, but not on mobile (the slider takes up less than half the screen on mobile).
Here’s a link to the site:
https://pixelpie.io/
If you load it on desktop and mobile both, you’ll see what I mean.
Thanks!
RuheeneAugust 24, 2020 at 7:59 am #159818Not sure if my link loaded in the last post- but here it is again, just in case:
pixelpie.io
Thanks.
August 24, 2020 at 12:01 pm #159841Hi,
I can’t understand a thing what you are saying.
Can you send us the screenshot of your issues? Upload your screenshot on http://imgur.com/ and paste the share url here.
Regards,
ChrisAugust 24, 2020 at 3:57 pm #159857Hi Chris,
Here is the imgur link with 2 screenshots below- one of my website on a desktop, and the other of my website on a mobile phone. See the difference in size/placement of the homepage slider on both devices? The images in the slider ‘cover’ the whole screen on a desktop (this is GOOD), but take up less than half the screen on a mobile phone (this is BAD- too much negative space on screen).
I would love to have the images in the slider ‘cover’ the entire screen on a mobile device as well. Let me know if anything is still unclear.
Thanks,
Ruheenehttps://imgur.com/a/uWAsdjR
August 25, 2020 at 11:43 am #159928Hi,
Kindly go to Appearance >> Customize >> Basic >> Scroll down to find Custom CSS and paste there:
@media screen and (max-width:479px) { .nivoSlider { min-height: 63vh !important;} .nivoSlider img { max-width: 200% !important; width: 200% !important; } }
Regards,
ChrisAugust 27, 2020 at 7:27 am #160057Thanks. That definitely made it larger, but it still doesn’t cover the screen. I tried 100vh and 300% instead of 200%, but that didn’t work either.
Any suggestions?
August 27, 2020 at 12:15 pm #160076Hi,
Kindly use this one:
@media screen and (max-width:479px) { .nivoSlider { min-height: 63vh !important;} .nivoSlider img { max-width: 350% !important; width: 350% !important; } }
Regards,
ChrisAugust 28, 2020 at 8:03 am #160143That worked, thank you! Much appreciated.
August 28, 2020 at 11:56 am #160157????
-
AuthorPosts
- You must be logged in to reply to this topic.