-1

If i apply line-height : inherit on html element then from where does it inherit the line-height value. Because apparently html has no parent from which it can inherit its styles. Does it inherit from the system (OS)?

Selaron
  • 6,105
  • 4
  • 31
  • 39
RK_15
  • 929
  • 5
  • 11
  • 0 If i apply "line-height : inherit" on HTML element then from where it inherits the "line-height" value. Because apparently html has no parent from which it can inherit its styles. Does it inherits from the system (OS)? – RK_15 Feb 04 '19 at 12:34
  • Can you please show your code so that we can get context? – Corné Feb 04 '19 at 12:36
  • That code is very big around 20 pages in html. I can show u a demo code:

    Hello world

     – RK_15 Feb 04 '19 at 12:38
  • @Corné IMO the OP is asking for a query. I don't think the OP needs to post some code for this. – Allan Jebaraj Feb 04 '19 at 12:39
  • 1
    it has no other element to inherit, it takes browser default value. we cant say OS becuase it varies from browser to browser mainly. – Joykal Infotech Feb 04 '19 at 12:41
  • How can i see the browser default values for all the styles. if "line-height : inherit" is there then i want to see the numeric value so that i can change accordingly – RK_15 Feb 04 '19 at 12:44
  • Why are you applying `line-height` to the `html`? And if you have to do it like this, why not set a value? – Corné Feb 04 '19 at 12:44
  • See i am doing bug fix work. I wanted to retrieve the same line-height value that is already there in the document. So i need to know what is the current line-height value in pixels so that i can change it in entire document. – RK_15 Feb 04 '19 at 12:47
  • Hello there, as far as I know, is the root element, and the root element gets the initial value from the browser only, there is no use in applying that to the html tag. Instead set the line-height to individual elements, use `vh` or specify height in terms or percentage. For beginners, I recommend learning bootstrap – kowsikbabu Feb 04 '19 at 12:47
  • The default `line-height` value is `normal` https://www.w3schools.com/cssref/tryit.asp?filename=trycss_line-height – Corné Feb 04 '19 at 12:48
  • yes it is default but is there a way i can see its numeric value like we can see the numeric value of width in offsetWidth and height in offsetHeight properties. – RK_15 Feb 04 '19 at 12:49
  • No, you can not directly look up what numeric value `normal` corresponds to. You can get the calculated _pixel_ value form your browser dev tools. https://developer.mozilla.org/en-US/docs/Web/CSS/line-height#Values shows you that Firefox uses `1.2` for `normal`, and if you check the actual specification, you’ll see that browsers should use a value between 1.0 and 1.2 for normal, https://www.w3.org/TR/CSS2/visudet.html#propdef-line-height – 04FS Feb 04 '19 at 13:02
  • @04FS Got it. Thanks for clarification. – RK_15 Feb 04 '19 at 13:08
  • To be pedantic, Firefox uses the value 1.2 _rounded to whole pixels_. For a font size of 16px, `normal` results in 19px, while `1.2` results in 19.2px. Not sure about Chrome; Chrome doesn't show a size in px in its developer tools when the value is `normal`. – Mr Lister Feb 04 '19 at 14:10

1 Answers1

0

There are different ways an element can have some specific style:

  • css applied by your css

  • css default style for each element this values are applied by default, you can check some default values here

  • css applied by the browser, each browser puts its on default styles, this article can help you to normalize this problem.

HTML tag inherit its default styles from browser or OS?

it inherit its default styles from the browser.

Community
  • 1
  • 1
Renzo Calla
  • 7,486
  • 2
  • 22
  • 37
  • Ok that answers my first question that from where HTML tag inherits its default styles. So if i have to change my "line-height" for entire document then i only have to assign new line height (numeric value in pixels) to my HTML tag and inherit that wherever i want in entire document. – RK_15 Feb 04 '19 at 13:04
  • yes all the descendant elements will inherit from html, consider that not all the properties are inherited you can check this list https://stackoverflow.com/a/5612360/2894798 – Renzo Calla Feb 04 '19 at 13:09