So, I feel like there’s something I’m still not grasping about how font-sizing works in relation to inheritance between elements.
I’m working on a page with an h1 element for a title contained inside a header element. Now, I’m creating a class called “titletext” to set the font family and font size. I’d initially applied this class to the parent header element but then tried applying it directly to the h1 element when I couldn’t get “font-weight” to work properly. But I noticed that setting font-size produced vastly different results when the class applied to either the header parent or the h1 child, even when I set the size in px.
Now, I thought that any classes established in the parent just automatically inherit to the child without the occurance of another precedence like inline CSS, so why is it that a font-size of 50px looks drastically different when the class is applied to the header parent versus the h1 child contained within? Isn’t the size of 50px dependent on the size of screen, not the size of the element itself?