Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 

  • Different behavior of heading tag with section

    @mukul.kant
    Recommendations Offline Message

    • 0
    • 0
    • 0
    • 2
    • 0
    • 0
    • 0
    • 895
    Answer it

    If I'm write Heading tag (h1 and h2) in section or aside it shows same font size and if I put this outside of section or aside tag it works normal. Why?

    1. <h1>heading 1</h1>
    2. <h2>heading 2</h2>
    3. <h3>heading 3</h3>
    4.  
    5.  
    6. <section>
    7.     <h1>heading 1</h1>
    8.     <h2>heading 2</h2>
    9.     <h3>heading 3</h3>
    10. </section>
    11.  
    12. <aside>
    13.     <h1>heading 1</h1>
    14.     <h2>heading 2</h2>
    15.     <h3>heading 3</h3>
    16. </aside>
    html css HTML5 heading heading tag
    Answer it

 2 Answer(s)

  • @saurabh27sharma
    Recommendations Offline Message

    over 8 years ago

    This is an browser custom styles) Eg. h1 outside of section or aside have font-size: 2em, but in section, article, aside, nav have font-size: 1.5em See in devtools.

    :-webkit-any(article,aside,nav,section) h1 { font-size: 1.5em; -webkit-margin-before: 0.83em; -webkit-margin-after: 0.83em; } Outside of article, section, nav, aside h1 have this styles

    h1 { display: block; font-size: 2em; -webkit-margin-before: 0.67em; -webkit-margin-after: 0.67em; -webkit-margin-start: 0px; -webkit-margin-end: 0px; font-weight: bold; } If you don't want such surprises - reset browser styles with normalize.css

Sign In
Forgot Password?
                           OR                           
Create an account !!
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Reset Password
Fill out the form below and reset your password: