Randy
Randy

Reputation: 16677

Help with Image sizing Issue in ie

i have some markup, (i know it does not use css - this is a restriction in my environment) it goes like this:

<table width="100%" cellpadding="5">
<tr><td  width="60%">
    <img src="../images/oracle_memory.gif" alt="oracle_memory.gif" width="100%"/>
</td>
<td>
</td>
</tr>
</table>

In ie, the image shows always at 100% of its original size, in other browsers (chrome, firefox) the image scales to fill 100% of the cell size - which is what is intended...

is there an ie specific hack or syntax that will make this image behave consistently in all browsers?

tia

Upvotes: 2

Views: 230

Answers (4)

NicoJuicy
NicoJuicy

Reputation: 3528

use style="max-width:auto;" instead of max-width:100%;"

Upvotes: 0

kheya
kheya

Reputation: 7621

What happens if delete the width="100%" from the image tag?

If it is always 100%, do you even need this style value?

You are not scaling the image dimension.

Just a thought...

Upvotes: 1

Matt
Matt

Reputation: 477

Some things to try.

  • Try to use width="inherit" on the img or use the min and max-width styles on both the td and the img until you get what you want.

  • if you are familiar with javascript or jquery you can just get the width of the parent element (the td) and set the image width to that. That would force the image to load scaled to whatever the parent container is.

Or you can give your td an id="xyz" and do this inline:

<img width="javascript:document.getElementById('xyz').width">
  • Get a Developer Tools installed in IE so you can inspect the DOM and modify the Styles etc until you get it looking the way you want it.

Upvotes: 1

NGLN
NGLN

Reputation: 43659

You are setting the width of the image rather then that of the style of the image.

Change:

<img src="../images/oracle_memory.gif" alt="oracle_memory.gif" width="100%" />

Into:

<img src="../images/oracle_memory.gif" alt="oracle_memory.gif" style="width:100%;" />

I even think IE is right is this case.

Upvotes: 1

Related Questions