Home > Net >  why h1 tag is rendering normal size text in react/nextjs?
why h1 tag is rendering normal size text in react/nextjs?

Time:09-22

In my react app whereever i place h1 tag it just showing a normal font. On inspecting i found that my text is rendering as h1 but style of h1 is

h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit;
}

I also tried to change this in my global.css

h1{
    font-size: large;
    font-weight: 900;
}

But it did not work. So how to render h1 as heading 1 text and font size

CodePudding user response:

h1{
    font-size: 80px;
    font-weight: 900;
}
<h1>Example</h1> 

CodePudding user response:

It appears to be the problem of specificity. Your global.css rules are being overridden by more specific rules. And from the available information, I don't know what or where those rules are.

This will help you understand better: MDN CSS Specificity

  • Related