How to resize slideshow images for wide screen on Dawn Theme?

[antelopepets]

Hi there, 

I'm trying to format the homepage on the Dawn Theme and reformatted my slideshow HP images to be 1600 x 1050. It displays fine on the desktop but the image sizing does not modify for wide-screen. The image gets cut off when displayed for a wide screen.

Can someone please assist? Thanks,

Wide screen: 

Desktop: 

[NomtechSolution · Accepted solution]

1. In the theme editor, navigate to the section that contains the slideshow or carousel where the images are displayed on the homepage. This section might be named "Slideshow," "Hero," or something similar.

2. Look for any settings related to the image size or dimensions. The options might be labeled as "Image width," "Image height," or "Slide size." Adjust these settings to ensure that the images are displayed properly on wide screens.

3. If the theme editor does not provide specific options for adjusting image size or dimensions, you can try adding custom CSS code to override the default styling. To do this, locate the "Theme settings" menu in the theme editor and look for an option to add custom CSS. Enter the following CSS code to make the images responsive:

.slideshow__slide img {
  max-width: 100%;
  height: auto;
}

[mimed]

Hi, 
Once I reduce the size of the image, how do I centre the image then?

Thank you

[Christian_R]

Hi! How can I make this change does not affects mobile version? It cuts the picture below on the mobile version

[ragnaar]

hi thanks i have tried this method it did solve the problem but also created a new one.

it created a grey space under the image

[miguelg0610]

Hello, I am using Dawn theme and facing a similar issue. I added a slideshow, but the images get cropped off on the top and bottom when viewed on different screen sizes. What should I do? Any help is appreciated. Thank you!