auto sizes on slideshow make the home page look strange

[drummergirlclaire]

having each slide in the slideshow be a different size (depending on the size of the photo) makes the homepage look very wonky and strange. I recommend making the slideshow a set size that forces the photos to all be the same. looks a lot better that way, in my opinion.

here is the code for the css:

.posts-slideshow .slides img { width: 650px; display: block; height: 350px; }

[zyml]

having a fixed width/height will break the responsive layout. the image sizes are stretched to fit the main content's container, which is different when viewed between different devices.

[drummergirlclaire]

that's cool.. no worries. It's easy enough to add fixed size to user.css if anyone prefers the fixed size slideshow.

thanks, Zy!

[magaman]

To kinda piggy back on this, I noticed one thing if you set the height of the post thumbnails to a lower value the slideshow container will remain large yet the img displays at the smaller size, in my case 250px. I found changing the min height as shown below fixes this issue. I wonder if this is part of the oddness being noticed. Also Zy I don't know if you want to consider the container sizing being off when height is set low another bug? I think your original min-height value was 305px. Also I should note the edit I made to min-height doesn't seems to cause any issue with the slideshow when you don't set a featured image and allow the them to auto select.

.posts-slideshow { margin: 0 2% 1.5em 0; padding: .5em; border: 1px solid #E1E1E1; box-shadow: 0 0 10px 2px #EEE; position: relative; min-height: 250px; }

[zyml]

the reason for the min-height property is to ensure that the content after the slideshow will not 'jump' once the slideshow images are loaded (try removing the min-height property and you will understand why). However, this property is removed when viewed on a mobile device.

[magaman]

I understand that, but as I have found out if I set the the Single Post thumbnail height to say 250px the default min-height causes the container to be larger then the actual slideshow image displayed. You can see it here http://imgur.com/FX8zj changing the min-height of the container to 250px fixes the issue.