CODEWITHSUNDEEP
imageresponsive-designinternet-explorer-10css
Denver Dang
Denver Dang

Reputation: 2615

max-width and max-height for fluid images not working in IE10

I'm trying to make a semi-responsive design on my website. And for that I use percentage for the width and height of everything except the page-wrapper, where I set a max-width in pixels.

I also put max-width and max-height equal 100% on my pictures, so that when people decrease their browser size, so will the images and follow along with the rest of the content. This is working as intended in Chrome, but in IE10 it does not. As far as I can see, it's only when I put my pictures in divs that have display: table-cell

Without the picture in the div, the div increases or decreases according to the window size, just as it should, in both IE and Chrome. But when I put in an image with style="max-width: 100%; max-height: 100%;", then it doesn't scale, not in IE at least.

Is this a bug, or is it working as intended. And is there anything I can do ? :)

Thanks in advance.

Upvotes: 0

Views: 4798

Answers (2)

Matthue DeYarus
Matthue DeYarus

Reputation: 21

This IS a bug in IE...but you can often fix it by making the table container have a table-layout attribute equal to 'fixed'.

Upvotes: 2

CodeWriter
CodeWriter

Reputation: 1

Add !DOCTYPE to the top of the page to get max-width and max-height working in IE, e.g.: < !DOCTYPE html public "-//W3C//DTD HTML 4.0 Strict//en" >

http://msdn.microsoft.com/en-us/library/ie/ms530811(v=vs.85).aspx

Upvotes: 0

Related Questions