difference between css height 100 vs height auto

Question

I was asked a question in an interview that  what is the difference between the css height 100  and height auto     Can any one explain

User · Answer

The default is height  auto in browser  but height  X  Defines the height in percentage of the containing block

User · Answer

height 100  works if the parent container has a specified height property else  it won t work

User · Answer

A height of 100  for is  presumably  the height of your browser s inner window  because that is the height of its parent  the page  An auto height will be the minimum height of necessary to contain

User · Answer

height  100  gives the element 100  height of its parent container   height  auto means the element height will depend upon the height of its children   Consider these examples   height  100    lt div style  height  50px  gt       lt div id  innerDiv  style  height  100   gt       lt  div gt   lt  div gt     innerDiv is going to have height  50px  height  auto   lt div style  height  50px  gt       lt div id  innerDiv  style  height  auto  gt             lt div id  evenInner  style  height  10px  gt             lt  div gt       lt  div gt   lt  div gt     innerDiv is going to have height  10px

[css] difference between css height : 100% vs height : auto

Examples related to css