
The image itself extends outside of the Div, but with my CSS, I’ll be making all the overflow hidden.īut CSS can help me out a little more. I usually take a Div holder approach, with the width pre-set in CSS.įor example, the image below shows the border (in blue) of my holder Div. We will be using jQuery, of course, but CSS will be in a supporting role.

But the solution below has been the most effective (and easy) one for me to use. Since this is a fairly common problem, there are many other ways of solving the issue.

But if the image could be either, you come across an awkward problem of making changes to the size of the image AFTER it loads.

If all the images will be vertical, you can do this just with CSS same for all horizontal images. At some point, every web developer comes across the need to fit an image of unknown size into a space on the site they’re building.
