set max height for gallery container

I have many photos and they are in different orientations (some are in horizontal and some are in vertical) in different gallery sets (all photos in gallery almost always has a horizontal or a vertical orientation). Wide images is almost look fine with default settings but tall images look awful I can’t understand how to set max-height for gallery container. .image-gallery {max-height: 400px} do nothing at all.

If I set .image-gallery {width: 500px} it will affect to fullscreen mode and made it useless and width property affecting wide photos which become very tiny.

[ivarne]

I think i solved a similar problem with

.image-gallery-content:not(.fullscreen) .image-gallery-image {
  width: 100%;
  height: 0;
  padding-top: 75%; /* Make the image wrapping div take a ratio of 3:4 */
  position: relative;
  img {
    position: absolute;
    top: 0;
    object-fit: cover;
    object-position: center center;
    width: 100%;
    height: 100%;
  }
}

[xiaolin]

You shouldn’t need that. You can nest css classes.

.image-gallery {
  // regular css.
  width: 400px;
}

.image-gallery.fullscreen {
  // your full screen css
  width: 600px;
}