You’ve been asked to do it a really bad way
The question is - are you serving your boss better by slavishly following his orders and producing something that doesn’t work properly, or by advising him on how to make something better?
That’s where your position as a professional comes in. People come to you rather than do it themselves as you know how to do it and why things need to be done certain ways. Your job isn’t just to code, it’s to educate and do what’s in your clients best interests!
Yes, font sizes are relative to the font size of their parent/container.
The upper most container being the <body> that has the font size as set in the browser preferences.
If you want to avoid confusion you could do the following: instead of nesting the .8em in the 3em div you could create to spans/divs in the containing div, one with .8em and one with 3em, and don’t specify a font size for the containing div.
The best advice for font size it to always use relative sizes like % or em, seeing as some people have the font size in their browser increased (because their vision is not really good and they need the font bigger in order to be able to read things).
For those people, you’re really not helping if you define your font in pixels, since it will probably be (a lot?) smaller than they’re used to.
Using em or % the font scales so these people can also access your site.
Ok, so bad layout from an accessibility standpoint.
Complete and miserable /FAIL/ at layout since that’s pretty much a no-no if we’re talking the entire page or content area.
possibility of two scrollbars - way to go…
If you are talking CONTENT like paragraphs, it is NEVER ok to use px. PERIOD. But, since you are fixing the height of the container, you can’t use dynamic fonts without either breaking the layout or tripping the second scrollbar.
Though it hinges on what element your talking about - if this is just a small header next to the logo, then fine… if it’s the actual page content; the part the user is ACTUALLY visiting the page to read… it sounds like you’ve gotten WAY too complicated for your own good.
Lemme guess, have some pretty picture drawn up in photoshop that doesn’t have ANY design provision for growing in height? That would be ANOTHER example of why “but I can do it in photoshop” has nothing to do with practical web design.
Though without seeing the actual content or elements involved, anything ANY of us would say here is pretty much wild guesses in the dark. The only thing I can say for certain is that your first three details revealed are things in design I usually say “NO!” to.
I’ve literally slapped an artist for that once. (note, if all they can do is draw pictures in photoshop they’re not a web designer, they’re an artist since it means they know two things about coding and accessibility guidelines - and Jack left town, took his **** with him!)
Rule One for Web Pages - there are no fixed sizes, anything you try to fix in size will either break in most of your visitor’s browsers or they will override your sizes with their own so as to make the text the size they want. If you don’t design your content to be flexible then it will just look like garbage to many of your visitors and be a showcase for how little you know about the web.