Как создать квадратный div, ширина и высота которого точно соответствуют высоте персонажа? - PullRequest
Новая
       6

Как создать квадратный div, ширина и высота которого точно соответствуют высоте персонажа?

0 голосов
/ 25 мая 2018

Я хочу создать div, в котором width и height точно равны высоте 1 символа, а ширина и высота должны реагировать: если я изменяю размер шрифта, ширинаи высота также изменится.Я попробовал: 

<table border="1" style="position:relative;">
  <tr>
    <td style="font-size:144px">&nbsp
      <div style="position:absolute;top:0%;left:0%;background-color:red;width:100%;padding-bottom:100%;"/>
    </td>
  </tr>
</table>

, сторона красного квадрата которого автоматически равна width "".Но я хочу, чтобы оно было равно height "", я попытался: 

<table border="1" style="position:relative;">
  <tr>
    <td style="font-size:144px">&nbsp
      <div style="position:absolute;top:0%;left:0%;background-color:red;height:100%;padding-right:100%;"></div>
    </td>
  </tr>
</table>

, которые просто заменяют "width" на "height" и "padding-bottom" на "padding-right", но, кажется, не работают, есть ли способ сделать это

...