seiji_tattoo Posted June 14, 2023 Share Posted June 14, 2023 I added a custom font to my website's menu using CSS code. The issue: On some screens (mobile and some monitors), Squarespace is making the font strangely fatter, which ruins the look of the font. It seems like it may be an accessibility function? Anyone ever seen something like this? How it should look (preview of mobile while editing the code on a laptop) : How it actually looks (live on iPhone 14 pro) : --- The CSS Code: @font-face { font-family: BORNA SEMIBOLD; src: url(https://static1.squarespace.com/static/6358cea32e183d318f6e4d8e/t/646d72e4bfcab25d51876af8/1684894436589/borna-semibold-webfont.ttf); } //Style Mobile Menu Font .header--menu-open .header-menu-nav-folder-content a {font-family: BORNA SEMIBOLD} Link to comment
tuanphan Posted June 20, 2023 Share Posted June 20, 2023 The problem may come from the custom font. Do you have any other font format? (eg: woff, woff2,..) Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
seiji_tattoo Posted June 29, 2023 Author Share Posted June 29, 2023 Hi tuanphan, thanks for the idea. I do, I will try! Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment