SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Evangelist winterheat's Avatar
    Join Date
    Aug 2007
    Posts
    508
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Smile pure space directly inside div ignored, but pure space directly inside span honored

    i found that there is a rule regarding "pure space" directly inside a block element or directly inside an inline element. For the following example, in compliance strict mode:

    Code HTML4Strict:
    <body>
     
        <div>
     
                 hello
                 world
     
       </div>
     
     
     
        <div>
     
                 <img src="pic.jpg">
                 <img src="pic.jpg">
     
       </div>
     
     
    </body>

    there are tons of spaces after the first <div>, and they are the newline and space characters. But none is honored. None is rendered. (I think they are stored in the DOM tree, but it is just not rendered on the displayed, because they are directly inside a block element). Also between the two <div></div> ... <div></div> there are tons of spaces in the "..." region, but none is rendered. And the same goes for spaces before the first <img> tag and after the second <img> tag. (i tested using a body width of 300px, with two images of width 150px, and the spaces after the second <img> is not causing any vertical enlargement of div area if i set a visible border on the div. to see both images on the same line in this case, the <img> tags will need to be side by side, without any space or newline in between)

    So the rule is, any pure space directly inside a block element is ignored when the browser displays it, it would seem.

    Now, when the anonymous inline begins, such as in the case of "hello" and then "world", and in the case of the first <img> and the second one, since it begins an anonymous inline element, any pure space in between will be rendered.

    That goes for newline, indentation by tab or space characters, etc.

    And that's why we can freely indent the <div> with lots of spaces and newline without any side effect.

    This seems like the rule, applicable on IE7, Firefox 2, and Safari 3. This being the general rule it seems, does the spec actually say something about this?

    Last edited by winterheat; Mar 28, 2008 at 19:03.

  2. #2
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,593
    Mentioned
    24 Post(s)
    Tagged
    1 Thread(s)
    It is implicit in what block and inline mean.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  3. #3
    SitePoint Evangelist winterheat's Avatar
    Join Date
    Aug 2007
    Posts
    508
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by felgall View Post
    It is implicit in what block and inline mean.
    I'd like to find out how to implicitly build a rocket, or implicitly write a computer program, or implicitly design some style sheets.

  4. #4
    SitePoint Evangelist winterheat's Avatar
    Join Date
    Aug 2007
    Posts
    508
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    this being "obvious" to some people, i have yet to find any sentence or sentences in any formal doc saying this is a rule in HTML 4.01. Anybody up for it?

  5. #5
    Design Your Site Team bronze trophy Erik J's Avatar
    Join Date
    May 2007
    Location
    Countryside, Sweden
    Posts
    3,407
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Maybe what you are looking for boils down to "user agents should collapse input white space sequences", quote from w3.org
    Happy ADD/ADHD with Asperger's

  6. #6
    SitePoint Evangelist winterheat's Avatar
    Join Date
    Aug 2007
    Posts
    508
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by erik.j View Post
    Maybe what you are looking for boils down to "user agents should collapse input white space sequences", quote from w3.org
    the collapsing white space... i know that all along since 1995... but it is good to see the spec mentioning of it.... but the <div> part is that IT WILL IGNORE ALL WHITE SPACE. It is not collapsing. It is TOTAL IGNORE. there is a difference.

  7. #7
    SitePoint Evangelist winterheat's Avatar
    Join Date
    Aug 2007
    Posts
    508
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    actually, i found that the rule in post #1 is not entirely true... i will post the follow up in another thread.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •