-
Posts
-
I’m using the Full Width Easy Slider on the home page of a website and I want to specify a height in the media quires so the photos in the slider aren’t so small when you view it on a smaller screen. I added:
.avia-slideshow-inner { height: 345px !important; }That makes the area where the slider is displayed the height I want, but there is white space under the photos in the slider. So I added:
.avia-slideshow-inner img { height: 345px !important; }That fills the areas, but it stretches the image vertically. Is there a way to specify the height of the slider and images in it, but allow them to scale so they keep their proportions? Thanks!
Hey NicomIT,
Could you provide us with a link to the site in question so that we can take a closer look please?
Regards,
RikardHi,
add a width value into your existing code:
@media only screen and (max-width: 1024px) { .avia-slideshow-inner img { width: 200% !important; max-width: 200%; }}and adjust as needed.
Best regards,
AndyThanks Andy. I gave that a try, but it still didn’t look quite right. So changed it back without ant media quires and the slider is resizing using the default options now. I think that looks better. But I’d like to hide the slider and show a single background image when you get down below 758px. I have a background there now. But can’t seem to hide just the slider and display the background in the same area. Is that possible to do?
Hi,
you could do this: http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/ and then build one element for which you hide on desktop only and vice versa. For example:
.hide-on-desktop { display: none; }Use “hide-on-desktop” as custom class.
Best regards,
Andy
- You must be logged in to reply to this topic.