Member Avatar for thijscream 
<a href="javascript: void(0)" onclick="window.open('images/<?php echo $afbeelding;?>', '<?php echo $afbeelding; ?>', 'width=119, height=400'); return false;"><img id="wijnimgsmall" src="images/<?php echo $afbeelding;?>" height="65%" border="0px"></a>

this is the image i'm currently using. but in IE the image isn't showing 65%.
is there any way to fix this?
here is an example in IE(in chrome it works ok)

thanks

  • 3 Contributors
  • 2 Replies
  • 61 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by Rajib Ganguly

Dani AI

Generated

Short version: Internet Explorer is not "broken" here — percentage heights on replaced elements like images only work when the containing block has a definite height. The HTML height attribute is meant to be a pixel value, so height="65%" can be ignored or handled inconsistently. and seeing it work just shows different environments (doctype/document mode or a parent that already has a fixed height).

Quick, practical fixes:

  • Move sizing to CSS rather than the height attribute.
  • Make the image's containing block have a definite height (px or a percentage where the ancestors up to html/body also have heights set).
  • For modern layouts use max-height or vh units, but note vh is not supported in older IE (pre-IE9) — provide pixel fallbacks or a small JS fallback for those browsers.
  • Use IE's F12 tools to check the computed height and the Document Mode / Compatibility View.

Example patterns (adapt to your markup):

/* ensure percent-based heights can resolve */
html, body { height: 100%; }

.container { height: 400px; }        /* or a percentage if ancestors have definite heights */
.container img { height: 65%; width: auto; display: block; }

/* modern viewport-based alternative */
img.responsive { max-height: 65vh; height: auto; width: auto; }

References: CSS height, HTML img element, Quirks mode and standards mode.

Post the page DOCTYPE and the container markup (not the same code already posted) for a specific minimal change.

Recommended Answers

All 2 Replies

Member Avatar for ndeniche

Works fine for me..

First one is firefox, second is IE

resize_ff.png 79.19 KB resize_ie.png 57.33 KB
Member Avatar for Rajib Ganguly

works fine in IE8

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.