如果其中有图片，则td元素太宽

Question

我现在正在开发Pokedex，但是图像有问题。

移动行是这样写的：

<tr class=".$rowClass."><td><img src='../img/types/".strtolower($getChargedMove['type']).".png' width=10% style='display: block;' /></td><td> ".$getChargedMove['name']."</td><td>".$power."</td><td>".round($dps,2)." </td><td>".$getChargedMove['energy_delta']."</td><td>".$moveTime."</td></tr>

但是我的问题是，在这种情况下，图像<td>太宽了，它应该：

如何解决此问题？我只希望它和类型符号一样宽。

Answer 1

在HTML5中，宽度值必须以像素为单位。

Answer 2

您需要给包含图像的<td>元素指定宽度。

https://www.w3schools.com/tags/att_td_width.asp

Answer 3

此问题可能是由于将width=10%属性设置为img元素引起的。

<img src='../img/types/".strtolower($getChargedMove['type']).".png' width=10% style='display: block;' />

对此的可能解决方案是设置所需的img宽度（以像素为单位）。

例如

  

width = 10