Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS [Solved] HTML to CSS Image Sizing Issue Reply To: [Solved] HTML to CSS Image Sizing Issue

#204328
Alen
Participant

@mrcodes If the image is larger than defined width and height then you’ll have overflow, you can hide this by adding overflow: hidden;.

#header {
  width: 1024px;
  height: 375px;
  overflow: hidden;
}

You may also experiment by making the image flexible, meaning it will resize proportionally to it’s container size. You do this by adding max-width: 100%; to img element.

So

img {
  max-width: 100%;
  height: auto;
}

Example here.