It has come to my attention that it is not a widely known fact that you can resize images, while keeping the ratio in perspective using CSS. I was using my technique for doing this the other day, and was curios to see if other people had discovered better ways of doing this. To my surprise, I found that a lot of forum posts etc were mentioning that it cannot be done. Without futher stalling......here is how you do it, and make it work in all browsers as well.
<div id="main_image"> <img src="img/Bazaar.jpg" alt="Bazaar" title="img/Bazaar.jpg" /> </div>
#main_image
{
margin: 0 auto 60px auto;
height: 250px;
width: 350px;
text-align: center;
}
#main_image img
{
margin-bottom: 10px;
height: 250px;
width: 350px;
}
I know....this seems so obvious......but a lot of people were using the DIV to do the resizing, and in my experience this causes stretching with the image contained within the DIV.
Hope this helps,
- Tim
No comments:
Post a Comment