Clipping div's inner content

Question

I have a DIV of size 147x88 and inside it an image which has the same width, but might be larger in height. In this case, the image goes beyond the boundary of the DIV. Is there anyway to clip the image, keeping in mind that I want my page to work in old browsers which doesn't support CSS3 (IE7 and IE8)?

Answer 1

Set overflow:hidden; on the div:

#yourDiv {
width:147px;
height:88px;
overflow:hidden;
}

Example: http://jsfiddle.net/purmou/sN5PL/

Answer 2

Just hide the overflow of the div, and the containing image will be cropped to the dimensions of the div.

div{width: 147px; height: 88px; overflow: hidden;}