All geek questions in one place

The image is not displayed when the width and height are determined as a percentage using the parent <table> element

I am trying to scale the image by percent, and it displays correctly in Firefox, but not in Internet Explorer. The img tag must be inside the table.

<TABLE>
 <TR>
  <TD>
   <img src="test.gif" width="60%" height="60%">
  </TD>
 </TR>
</TABLE>

Is there a better way to do this so that it works in both browsers?

+3
source share
3 answers

Try sizing in CSS instead:

<style type="text/css">
    .myImg{
        width:60%;
        height:60%;
    }
</style>

<table>
 <tr>
  <td>
   <img src="test.gif" class="myImg" />
  </td>
 </tr>
</table>

I do not think that some browsers, for example, when you define the width / height in a string as nothing but a numerical value (i.e. width="200");

Anyway, give him a chance - good luck

+1
source

http://www.joelonsoftware.com/ - . FireBug, CSS, , .

0

Please try the following code:

<html>
<head>
  <style>
  table.full-width-table{
    width:100%;
  }
  td.center-text-td{
    text-align: center;
  }
  img.sixty-percent{
    width:60%;
    height:60%;
    margin:0 auto;
  }
  </style>
</head>
<body>
  <table class="full-width-table">
  <tbody>
    <tr>
    <td class="center-text-td">
      <img src="test.gif" class="sixty-percent"/>
    </td>
    </tr>
  </tbody>
  </table>
</body>
</html>
0
source

Source: https://habr.com/ru/post/1722022/

More articles:


All Articles