user6768630
user6768630

Reputation:

Font weight value is not working properly

I have tried to give a font-weight property to text widgets but it's not working properly, which will show the same bolder appearance for the values 100,200,300,400 and 500 and show a big effect on 600. What is this issue? How can I fix it?

.flip-menu-text {
    text-align: left;
    font-weight: 100;
    line-height: 1.125rem;
    padding: .5625rem 0;
    margin: 0;
    outline: 0;
    border: 0;
    font-size: 14px;
}
<span class="flip-menu-text">Widgets</span>

Upvotes: 1

Views: 1567

Answers (1)

James Taylor
James Taylor

Reputation: 6258

This has nothing to do with the CSS you provided and more to do with the font in question (which you did not specify).

Take this font, for example. It has 400 (normal), 600, 700 (bold), 800, and 300 font weight styles.

As stated by CSS-Tricks:

In order to see any effect using values other than 400 or 700, the font being used must have built-in faces that match those specified weights.

In short, if you are not happy with the font-weight available, try using a different font.

Upvotes: 2

Related Questions