Home › Forums › CSS › [Solved] HTML to CSS Image Sizing Issue › Reply To: [Solved] HTML to CSS Image Sizing Issue
June 28, 2015 at 4:33 pm
#204328
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.