Custom Slideshow Cropping Portrait Images

  • So I have this page on the site. I am not a coder, and our coders could not figure this out. I want to make it so, that our portrait images appear as portraits and now landscape and cropped.

    Here’s what I think is the line of code.
    }
    .showcase-slider–slide {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    @include gt-medium {
    height: 75vh;
    max-height: 600px;
    width: 88%;
    margin: 0 6%;
    }

    But I also have no clue. Sorry for the lack of knowledge!

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)

  • Short answer: you can’t.

    You can’t because you have a fixed height and width for the slideshow, and you want the images to cover that entire area. This means that any image that isn’t the exact ratio of that area will be cropped either horizontally or vertically.

    There is a way to get around it, but you won’t like it. ?? Turst me… I’ve had this discussion (over and over again) with the designers that I work with, and there’s always the same result. The only way to have all images show all of the image all of the time is to set a background colour on your slider area, and set the background image size to ‘contain’ instead of ‘cover’ – and be prepared to see the background colour show through on every slide.

    Thread Starter bfarrell4036

    (@bfarrell4036)

    Ohh no! Wow that’s a tricky one then isnt it. I appreciate your brutally honest answer though!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Custom Slideshow Cropping Portrait Images’ is closed to new replies.