I want to edit our homepage gallery slideshow on mobile only so that it shows the max width without cropping the height or stretching the image.
This is the code I tried using to show the full images in the gallery, but now it won't show the the navigation arrows on the sides nor the image descriptions (should be centered like how it is on the desktop).
<STYLE>
@media screen and (max-width:640px) {
section#home-gallery img {
width: 100% !important;
left: 0 !important;
height: auto !important;
}
section#home-gallery {
height: 210px;
}
}</STYLE>
*Note: I don't mind if the width of the images is cropped slightly. It just can't be cropped to the point of how it looks without any custom code. As long as you can read "Collin" and "UGP" on the first image in the gallery, that's fine with me.