Capital letter "J" acting weird using Cormorant Garamond & Cormorant

Hi,

How comes capital letter “J” with the font Cormorant Garamond or Cormorant jumps closer to the letter behind if the second letter is also a capital letter? This doesn’t happen to any of the other letters and fonts.

19

Hi @cecjonsson

I just tested this on my end in a new site, but wasn’t able to get the same weird behavior with the letter J.

Can you please share your Read-Only link :slight_smile:

Hey!

I’ve just tested both fonts and all is looking fine on my end :man_shrugging:

Can you give us your read-only link as well as your browser version?

Thanks! :slight_smile:
Bart

Hi,

was using Safari, tried it in Google Chrome and it looks fine, but still looks weird in Safari.

Read-only link: https://preview.webflow.com/preview/goforit3?preview=c312b86727435ae7148e07ba9b494c97*

Best
Cecilia

That link above has a * at the end (remove that @cecjonsson or it looks like your share link doesn’t work)

I saw this issue too very weird.
In safari it affects the spacing, and on Chrome it removes the ligature off the J but doesn’t affect the spacing.

I saw this in the designer.

Where did you download the font from? You could try re-installing it from a different source. I’ve had a similar issue with a font from Dafont.com

CloudApp

Hi @cecjonsson

Thanks for sharing your Read-Only link. I did some digging and found a couple of fixes for this issue.

  1. There’s a bit of CSS you can add to your custom code head field in site settings that will disable kerning and ligatures for any font – tested this and it appears to work.

     <style>
     body {
         text-rendering: optimizeSpeed;
     }
     </style>
    
  2. If you aren’t able to add custom code you can simply wrap the letter J in a text span and this appears to work as well:
    57%20AM

Hope this helps! :slight_smile:

1 Like

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.