Welcome to WebmasterWorld Guest from 18.104.22.168
Forum Moderators: not2easy
I need to put an image inside a box, centering and resizing it to fit the box. The box is positioned and sized in the page using percent values. The problem is that I don't know how can I do it exactly.
This is the style code for the box:
This is the style code for the image:
I don't know how to center the image vertically and how to resize it to fit the box mantaining its aspect ratio. Can someone help me, please?
Thanks in advance
padding: 10px; //or whatever
border: 1px solid #000000; //or whatever
display: block; //these take care of any wierd whitespace issues in different browsers
The attribute "text-align" doesn't really work on images. Having the padding all the way around the image will "center" the image vertically and horizontally. You can't really "resize" the image to fit the box and still keep the aspect ratio. You'd have to edit the image itself, I would think. Resizing images in the HTML code isn't advisable.