Bold weight of webfont keeps italicizing

Highlighted
Tourist
3 0 1

Hello!

I am using Metro Sans, a custom web font that I have uploaded in multiple weights, and I'm having issues with its "Bold" weight rendering in italics. I have been racking my brain trying to find out why this is happening and cannot, for the life of me, figure this out.

Here is how I am coding the bold weight:

@font-face {   
	font-family: "Metro Sans Bold";   
	src: url('{{ "metro-sans-bold.eot" | https://cdn.shopify.com/s/files/1/0246/6430/9840/files/metro-sans-bold.eot?v=1599756103 }}');   
	src: url('{{ "metro-sans-bold.eot" | https://cdn.shopify.com/s/files/1/0246/6430/9840/files/metro-sans-bold.eot?v=1599756103 }} ?#iefix') format("embedded-opentype"),
	url('{{ "metro-sans-bold.woff" | https://cdn.shopify.com/s/files/1/0246/6430/9840/files/metro-sans-bold.woff?v=1599756103 }}') format("woff"),        
	url('{{ "metro-sans-bold.ttf" | https://cdn.shopify.com/s/files/1/0246/6430/9840/files/metro-sans-bold.ttf?v=1599756103 }}') format("truetype"),        
	url('{{ "metro-sans-bold.svg" | https://cdn.shopify.com/s/files/1/0246/6430/9840/files/metro-sans-bold.svg?v=1599756103 }} #myfont') format("svg"); 
    font-style: "normal";
  	font-weight: "normal";
}

 

This issue is not occurring on the Book version of the font. Does anyone know why this would be happening? I have poked around, making sure that it's not being affected by any other classes, have adjusted the "font-weight" and "font-style" to "normal" as many websites were suggesting.

Any suggestions or guidance would be greatly appreciated! Thanks, in advance.

1 Like
Highlighted
Shopify Partner
7457 1032 2592

Hello, @fretnot 

Welcome to the Shopify community!
and Thanks for your Good question.

Please share your site URL,
So I will check and provide a solution here.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
Highlighted
Tourist
3 0 1

Hi Ketan, thanks!

Unfortunately it's in a staging site: https://made-by-haven.myshopify.com/admin/themes/83575111760/editor#/products/the-chair Are you able to view that?

0 Likes
Highlighted
Shopify Partner
7457 1032 2592

@fretnot 

Thanks for update

if possible to give me a screenshot particular section issue 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
Highlighted
Tourist
3 0 1

Screen Shot 2020-09-13 at 4.26.45 PM.png

"The Chair" is the type that is italicizing. Thanks for your help!

0 Likes
Highlighted
Shopify Partner
7457 1032 2592

@fretnot 

Thanks for clearing sorry but i can't see this look how can i see this

KetanKumar_0-1600055820629.png

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes