-
Posts
-
HI,
I have a problem with the fullwidth slider, once I added the minimum height to 250px it pushed the slider image to the left and leaves almost 50% of the slider empty on the mobile screen size.
When I canceled the minimum height it looks fine ( fullwidth )Hope you guys can help me solve this problem.
Uri
Hi Uri,
Here is the code you can put in Enfold > General Styling > Quick Css, if it does not work, put into themes/enfold/css/custom.css
/* full_slider_1 */ @media only screen and (max-width:767px){ #full_slider_1, #full_slider_1 .av_slideshow_full.avia-slideshow, #full_slider_1 .avia-slideshow-inner, #full_slider_1 .avia-slideshow li, #full_slider_1 .avia-slideshow li img { min-height: 240px; } #full_slider_1 .avia-slideshow li img { width: 120% !important; max-width: auto; } .html_header_transparency #top .avia-builder-el-0 .slideshow_caption { padding-top: 0px; } }If you need further assistance please let us know.
Best regards,
VictoriaHi Victoria,
I implemented the code and it works good, but there is anew problem that in the mobile resolution it distorts the image.
Can the image be cropped in the middle so it is not distorted ?Hi uribinsted,
You can try to change the width value here to find the one that fits you:
#full_slider_1 .avia-slideshow li img { width: 120% !important; max-width: auto; }If you need further assistance please let us know.
Best regards,
VictoriaHi Victoria,
I tried various values from 80% – 300%
and it seems to display maximum 100%.What I probably need is for mobile version image to be cropped
- You must be logged in to reply to this topic.