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 to switch fixed elements when scrolling down the page

    How to make a wavy border line to separate background images in html5/css?

    Jquery Show Hide with attribute

    How to display inline with rails?

    How to Centre a Page Layout With HTML/CSS?

    Parsley.js 2.0 How to use the provided css file

    How can I prevent this div in my table from increasing the cell height?

    How to set content area div height with dynamic header div

    How to select child element inside first, second or third html element with CSS classes?

    how to create proportional image height/width

    how to apply css to web app?

    How to get border radius and gradient background working together in IE 9

    3 column layout, same height, middle column full size. How to do it without “table-cell”

    How to do a darker background image in css3 and stretch it?

    How to apply padding to a column using and CSS in Firefox?

    how to apply multiple css image filters using jquery

    How do you disable horizontal scrolling on a webpage?

    How to mark up speedometer/gauge in HTML/CSS?

    background-image on divs aren't showing; the divs are collapsing instead

    How to select the second paragraph after another with css?

    How to create a backdrop for a dialog?

    How to make the progress bar with html css javascript

    javascript - how to get date locale to work?

    How do I apply a CSS class to Html.ActionLink in ASP.NET MVC?

    How is table cell height calculated?

    How to change an image on mouseover of wrapper div

    How to implement a web page that scales when the browser window is resized?

    Rails: How to control CSS, Javascript files

    how to set css to a specific attribute of an input tag

    how to make css div margin-top 20px from div above