Определить размер буквы

[firep91613]

Подскажите, пожалуйста, как определить размер буквы. Нужно, чтобы правильно ее спозиционировать. font-size стоит 16px, но на самом деле длинна и ширина разные.

[ruslan_mart]

Можно так:

const element = document.querySelector('svg text');

console.log(element.clientWidth, element.clientHeight);

или так

const element = document.querySelector('svg text');

const rect = element.getBoundingClientRect();

console.log(rect.width, rect.height);

[firep91613]

ruslan_mart,
благодарю.

[Aetae]

На самом деле универсально - только через canvas. У шрифтов куча всяких разных отступов и сдвигов: формально буква будет с т.з. html в одном месте и одного размера, а по факту где угодно и какого угодно.

Но в 99% случаев, если надо просто центрировать - всё решит:

display: flex;
align-items: center;
justify-content: center;

[firep91613]

Aetae,
ну по иксу нормально - по центру (Verdana, Arial, Times), по игреку - да, ерунда получается, разве что в ручную подбирать =)

Доделаю, потом на канвас перенесу.

[Aetae]

firep91613, если количество букв и шрифтов ограничено - лучше один раз вычислить все коэффициенты и хранить табличку, а не мучать клиаента.