How do I resize an image in IE 8


Tags: css,internet-explorer,image-resizing

Problem :

I have an image that is 90px x 90px (it's a jpg file) and I can't figure out how to make it 60px by 60px in internet explorer. I looked at a few sites already which told me to use this css style:

.img { -ms-interpolation-mode: bicubic; }

but nothing happened. This is the css I'm using currently which works really well in fireforx and chrome:

.img {
    horiz-align: center;
    width: 60px;
    height: 60px;
    margin: 10px;
    border: 1px rgb(218, 218, 218) solid;
    background: #C4C4C4 no-repeat 0 0;
}


Solution :

The issue with your original code is you're specifying img as a class i.e .img rather than img

Here's 2 ways to do this. 1st with no css:

<img src="your-image.jpg" alt="" width="60" height="60" />

2nd with CSS:

<img src="your-image.jpg" alt="" class="image-resize" />

...

img.image-resize { 
  width: 60px;
  height: 60px; }

    CSS Howto..

    How can I center-align text with uneven icons either side?

    How to change underline thickness of an a-tag without using border?

    How to make compatibale a css design for all the browsers?

    How to make a site have a built in user-friendly editor?

    How to set the container height automatically maintaining the ratio

    how can you have layers see through each other on a web page

    How can I eliminate the space above my list?

    How to change css image via php depending on weekday

    How to get rid of hidden space HTML/CSS [closed]

    In jQuery, how do I animate the “max-height” CSS property?

    How to turn off word wrapping in HTML?

    Angularjs how to add/remove dynamically input form with ng-Repeat on Google Maps?

    How do I create two columns using CSS?

    How to include by default icon inside a textarea

    CSS table: How to position action buttons left to each row

    text-align:center doesn't work vertically in CSS, how can I get around this?

    How do I stop the FLOAT (without extra markup)?

    Show s horizontally in a div
    table { display: inline-block; } This should work just fine for you....
    Read more

    How to rotate a div, while jQuery animates the same div

    How SCSS rule evaluation done by browser

    how to add equal empty spaces between images

    How should I make this code to display inline

    how to create a fixed js slider

    how to align divs with different width within another parent div?

    How do I get the background image to not repeat and take up the entire section?

    What do i need and how do I start to adjust the css of a website with “encrypted” .gz files

    how to give blur effect for css overflow visible content

    How to combine slide-in panels with sticky header?

    How to Flip Div's in Randomly

    How to set a CSS selector for links ( a Tag ) for a Class