Hello,
I want the featured slider area to respond when viewed on mobile. It currently just stays the same size no matter desktop or mobile.
Please help…
http://joinbigdwave.com/provider-template/
Thanks!
Kevin
Hi there
The text is little bit resized on the mobile, but if you want to make more changes you have to edit it in the files,
its in style.css line 313 and 316
As shown in the screenshot I provided - the photo is large and is only showing a portion of the whole slide. To be responsive for mobile it should scale to the size of the screen from right to left showing the whole image. The text should also be just in the left side of the slide, not covering the whole slide.
The whole slider area should be responsive. Please advise.
Please see attached screenshots…
Thanks
This template has a featured slider that is mobile responsive that scales to the mobile screen - https://colorlib.com/preview/#webuilder
I want the same functionality in the Medicare theme. Please help.
Thank you.
HI Kviras
Sorry but the problem here is not in the responsiveness but in the image itself when you use an image like this (characters on it on the side) it will not be universal for all type of screens, even on the example you posted we have exact same problem, not full image is displayed and showing one image on all devices is not possible,
i can offer only this small fix:
@media screen and (max-width: 768px){
#colorlib-hero .flexslider .slides li {
background-position-x: -869px;
}
}
but even this code is not universal 
regardging text, you already have lines of code where they are, you have to change them
Hello Noda,
I am not sure what you are referring to. The image should scale to the size of the screen as well as the text. This template is a responsive template and the flexslider should be fully responsive as well.
It is not responding to anything at all. It is not responsive. Why is the image not scaling to the size of a mobile device?
The code you provided did nothing at all. Please help.
Thank you.
HI
The image is responsive, an image which is covering screen on the desktop device where the screen is horizontally wide cannot be used the same way to the mobile/vertical devices, in other words, landscape/horizontally wide image cannot be fitted in the vertical screen of the mobile device, this is not about responsiveness this is just basic thing, it can not be fitted physically, take look at the attached image, how you want to fit that image in the mobile screen?
Hello Noda,
The image needs to scale down to the size of the screen. It should scale down in both width and height… That is what scaling down means.
That is what responsive should be like. See the below website examples…
If this slider is unable to do that I am surprised. Please help.
hi Kviras
Examples you provided are completely different, sliders are resizing in that examples when in our theme slider stays full height this is big difference, sorry but this theme works like this, honestly, i really want to help you but there is nothing i can do with this, you can compare it to our demo we have exact same behavior,
Solution is to find third party plugin and change existing element with some slider
Hi Noda,
Is there a way to have that slider area to be hidden on mobile devices?
Thanks for your help.
hey there
Add this CSS in appearance - customize - additional CSS
@media screen and (max-width: 768px){
#colorlib-hero {
display: none;
}
}
Thanks!
Colorlib Support Team
Hello Noda,
I do not know where appearance - customize - additional CSS is in this bootstrap template.
I put the CSS code in the style.css file and it did not do anything.
Please advise. Thanks.
Hi there,
Thanks for writing back.
In this case, please adjust the previous code to this, still on the style.css file:
@media only screen and (max-width:767px){
#colorlib-hero {
display: none !important;
}
}
I hope this helps.
Best Regards,
Support.