Block-level elements

Discussion in 'CSS' started by Cash Nebula, Apr 11, 2010.

  1. #1
    Is there any reason to set display:block for a block-level element (eg. h1)?

    I've seen it in a few slicing tutorials but I don't understand why it's necessary. Turning it off and on with Firebug appears to have no effect. :confused:
     
    Cash Nebula, Apr 11, 2010 IP
  2. drhowarddrfine

    drhowarddrfine Peon

    Messages:
    5,428
    Likes Received:
    95
    Best Answers:
    7
    Trophy Points:
    0
    #2
    It makes no sense whatsoever. I would never trust a tutorial by anyone who would do such a thing.

    That said, I might understand if it was used to reset an element that was set to inline earlier in the cascade but I can't immediately think of why that would be done.
     
    drhowarddrfine, Apr 12, 2010 IP
  3. Cash Nebula

    Cash Nebula Peon

    Messages:
    1,197
    Likes Received:
    67
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Na, it doesn't appear to be a reset.
    There are many critical comments :eek: but none mentions the display:block on the H1 element. I thought it might be a browser fix or some other trick.

    This is one of the tutorials:
    Coding a Clean & Illustrative Web Design from Scratch

    The header DIV is floated left but that seems unnecessary too. :confused:
     
    Last edited: Apr 12, 2010
    Cash Nebula, Apr 12, 2010 IP
  4. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #4
    I see people do it all the time - and you are right, it makes no sense and there's no good reason to do it... The only time I do it is when I'm using the display state change on a float so that hover's don't "stick in one state" in IE - and that's a VERY specific situation.

    But then the majority of people writing code don't even know the rules of inline-level and block-level elements, much less the default layout behaviors for each.
     
    deathshadow, Apr 13, 2010 IP
  5. Cash Nebula

    Cash Nebula Peon

    Messages:
    1,197
    Likes Received:
    67
    Best Answers:
    0
    Trophy Points:
    0
    #5
    Thanks for clearing that up, guys. :) Even the W3C CSS validator let it through without a warning.

    I didn't know about the hover problem in IE, must remember that one!
     
    Cash Nebula, Apr 13, 2010 IP