Jump to content
pstein

How to find the real inherited font-size and line-height for a text?

Recommended Posts

Sometimes when I inspect the web page HTML/CSS code and search for the font-size and line-height of a certain text I can not find it.

When I right-click (in Firefox) on this certain text and select "Inspect element"
the corresponding HTML/CSS code is shown in the lower pane in WebDeveloper.

However in the lower right sub pane I do not find the real, final font-size and Line-height.
All occurencies are labeled as "inherited"

Inherited from what?

I expect to get at least one valid font-size and line-height CSS value in the cascade chain.

Lets take an example from a german computer online magazine:

https://www.zdnet.de/88377738/smb-luecke-microsoft-veroeffentlicht-patch-kb4551762

Now right click on the line beginning with

Set-ItemProperty -Path "HKLM:\SYSTEM\Current......

at the bottom of the core article and inspect element.

For this text I found only "inherited" values.

How do I find out the current font-size and line-height?

I am NOT interested for a particular example but on how to find it out in general.

Peter

Share this post


Link to post
Share on other sites

If there is nothing in the entirety of the cascade then it means that it is using the browser's default. In Firefox, you can find a "Computed" tab near the "Rules" tab which will have a font-size property in pixels. If you don't see it there then click the "Browser styles" checkbox.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...