Font-display problem

(@millansoft)

Hello, i add in the css the following:

@font-face {
font-family: 'Spaceport';
src: url('/wp-content/themes/storefront/fonts/house/HOUSE3009-Spaceport.woff2') format('woff2'),
url('/wp-content/themes/storefront/fonts/house/HOUSE3009-Spaceport.woff') format('woff');
font-weight: normal;
font-style: normal;
font-display: block;
}

.spaceport-text {
font-family: 'Spaceport', sans-serif;
font-size: 27px;
text-align: center;
color: white;
letter-spacing: 1px;
margin: 0px 0;
text-transform: uppercase;

text-shadow:
-2px -2px 0 #000,
2px -2px 0 #000,
-4px 4px 0 #000,
1px 1px 0 #000;
}

but font-display: block; appears in red and seems to doesnt have effect, i´m doing something wrong? Its not supported that? Thanks

This topic was modified 10 months, 4 weeks ago by millansoft.

Viewing 1 replies (of 1 total)

Moses M. (woo-hc)
(@mosesmedh)

10 months, 4 weeks ago

Hi @millansoft,

Thanks for reaching out. font-display: block; is a valid CSS property. If it’s being highlighted in red by your code editor, it’s likely due to the editor being overly cautious or not recognizing the property, even though it’s been around since 2018 and is supported by most modern browsers.

You can go ahead and apply your changes to see if the style works as expected. If it does, there’s no cause for concern. However, if it doesn’t seem to take effect, you might want to reach out to WooCommerce experts on platforms like Codeable.io for further help. Since this involves custom solutions or theme customization, it falls outside our support scope.

Viewing 1 replies (of 1 total)

The topic ‘Font-display problem’ is closed to new replies.

Tags