Hey there,
I would like to achieve the look of a slider within full width of the page area (white area) as shown in the Image below.
I have tried applying revolutionary slider into my page customising it to auto/full width, however I still seem to experience the image in the slider being stretched/cropped. Taking into consideration with mobile transition as well.
Please advice me on how I should approach this to fix the issue. Would like to know if the cause is the padding of the page area etc. Hope to hear from you soon!
Website url: https://leapdsc.com/leapdsc/client/astar/techdepot/
Image: https://1drv.ms/i/s!Ai3uwVtbSehutfx44HYrArtkynuF0A
Hi,
You could try as a quick solution in this matter the code provided below, with this result – https://www.screencast.com/t/mufmM1CXivS However you should enter the code in Theme panel->Advanced Css in the desktop section, so it only applies in that situation, since this code could provide issues on smaller devices.
This is the code used in the example
.tp-revslider-mainul {
width: 1168px!important;
left: -48px!important;
}
Thanks
Hi,
thank you as it works perfectly! However, I apologise as I might have to trouble you with the other codings which would have the slider full bleed for tablet/mobile responsiveness as well. As I seem to have missed out on elaborating that detail.
Hi,
Using the code provided above in the desktop section of the custom css, will apply it only in this situation, For smaller devices it will remain the same, keeping it’s original responsiveness – https://www.screencast.com/t/lMHVG2Qww3t – https://www.screencast.com/t/M6kXmkCS
To make it like that in all situations, you would need to have different codes for these situations – https://www.screencast.com/t/upVesOxVo2c Maybe there is another way, but I can not say for sure, since it would take too much time to test, and make sure it works properly.
Thank you for understanding!
Hey there,
thank you for the quick response, however I do that quite get the way to input the code. What I want to achieve ideally is having a full bleed revolutionary slider across all platforms (desktop/tablet/mobile). For now, only the desktop version is working perfectly.
Hi,
As I mentioned this will not be so easy, to have the responsive design of the slider behave in that way. It would need to make modifications to the page container, the slider itself and other elements. If you want you can try to make these modifications and maybe you can achieve the desired result, because we can not provie this type of customization at the moment, sorry.
Thank you for understanding!
