- List item The picture below shows my code for the project. For some reason my first header (the one that reads Dasmoto’s Arts and Crafts) is way bigger than what it should be. I’m guessing it’s because some of my code is crossed out. Is this the case? If so, why is this happening? In VSC my code doesn’t appear that way. Furthermore, I don’t have the slightest as to where did the “user agent stylesheet” came from. What causes my code to be crossed out?
Hey Eduardo, how are you doing?
That is the “cascading” effect of CSS.
As you see are “crossed out” only
font-weight, the rules of
<h1> are being applied instead of those same rules of the
Check this out: Cascade and inheritance - Learn web development | MDN
Hey @usernamegiapreso! I’m good, thanks for asking.
Ok, so I went through the document you pointed me to. I understand what’s happening, but I don’t get where that “user agent stylesheet” is coming from. Is that some predetermined CSS stylesheet? Is there a way to just erase it or something?
Is that some predetermined CSS stylesheet? Is there a way to just erase it or something?
Kind of yeah. The user-agent is basically your browser, you can override it in different ways, the simplest is to just style that particular element differently.
In your case
user-agent is beating up the
inheritance, so add a rule to your CSS file that targets directly your
<h1> and you should fix it.
Awesome, thanks a lot!
You’re welcome, happy to help