0

I want to make a Logo out of two Fonts, but as you can see here, one font has close to no "padding" on top (left) and the other (right) font has. This makes it difficult to line them up. This is how i import the fonts:

@font-face {
    font-family:'hatton';
    src: url(fonts/Hatton-Medium.otf);
}

@font-face {
    font-family:'neuemachina';
    src: url(fonts/NeueMachina-Regular.otf);
}

Is there anything i can add to the import, so the fonts have the same "padding"?

Thanks in advance!

  • what for do you use the fonts? this is not a good practice, but it will help: *{padding:0} – HamiD Nov 30 '20 at 16:04
  • @hamid they are called Hatton Medium and NeueMachina. Adding padding: 0; doesnt change anything. – Peter Gil Nov 30 '20 at 16:08
  • can you give us some html and css code what you've tried so far? – HamiD Nov 30 '20 at 16:10
  • You can move the font a little higher with line-height. – Lars Flieger Nov 30 '20 at 16:12
  • Does this answer your question? [Remove white space above and below large text in an inline-block element](https://stackoverflow.com/questions/14061228/remove-white-space-above-and-below-large-text-in-an-inline-block-element) – Lars Flieger Nov 30 '20 at 16:16
  • 1
    Thanks @LarsFlieger, this answers my question. I found a unsatisfying solution of adjusting by pixels... very sad, but it seems that there is no easy solution for this. – Peter Gil Nov 30 '20 at 16:38

0 Answers0