Answer the question
In order to leave comments, you need to log in
Line-height in different OS works differently depending on the font?
In general, the situation is about the same as in this question .
I use line-height to vertically center the content in the block, as a result, everything looks great in all browsers under ubuntu, in which everything was typeset.
But in Windows, the layout went wrong (in all browsers, yes), if you correct the line-height under Windows, then everything looks ok in any browser, but then everything is crooked under ubuntu and mac (also in any browser).
Wang on fonts.
What determines the calculation of line-height in different systems with the same font? And how to overcome it?
Fonts are included via @font-face and are in .otf format.
The code:
<div class="bar">
<img src="img/ico/ico-phone.png" alt="Телефон">
<a href="tel:555-555">555-555</a>
<a href="tel:8-555-555-5555">8-555-555-5555</a>
<a class="mkcall" data-featherlight="#callback" href="#call">Заказать обратный звонок</a>
<input type="search" placeholder="Поиск">
</div>
.bar {
line-height: 70px;
height: 70px;
width: 65.76788%;
margin-right: 2.69637%;
text-align: justify;
font-size: 22px;
}
Answer the question
In order to leave comments, you need to log in
There was a similar question recently Why is there a difference in chrome on windows and mac?
It's not about the line-height property, it's about the font.
My customer is now thinking about how to replace the font.
I even did some research.
This font is here: www.myfonts.com/fonts/g-type/houschka-rounded-alt/...
Chrome on OS X:
Chrome on Windows
They say https://www.fontsquirrel.com/tools/webfont-generator can fix it. Nothing worked out with .otf, but .ttf didn’t, and it’s not clear whether it’s worth buying if it’s still a curve.
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question