Help needed with a responsive portfolio project

Help needed with a responsive portfolio project
0

#1

Hi everyone I have an issue where I have not found much information on around the rest of the web.
so first of all let me inform you this is not about the portfoliopage challenge for the certification.

so I am currently working on a responsive portfolio website for my girlfriend using bootstrap 3.
I have run across an issue in regards to image orientation when using img-repsonsive.
as long as I am using landscape oriented images my layout works. but as soon as I add a portrait oriented image in the mix, things go wrong.
obviously this has to do with the responsiveness being dependent on the device-width, but I am looking for a way where either the portrait images are cropped so the heights match or schrunk further.
does any one have any suggestions on how I might achieve something like this.

if need be I can put up a small codepen or github link to what i am trying to achieve.

thanks in advance for all the tips!


#2

The way I solved this problem is enclosing the image in an outer DIV.
The outer DIV then has a CSS height property, and an overflow:hidden property.
If the photo is larger than the div, it’s just cropped.