SitePoint Sponsor

User Tag List

Page 3 of 3 FirstFirst 123
Results 51 to 58 of 58
  1. #51
    Hibernator YuriKolovsky's Avatar
    Join Date
    Nov 2007
    Location
    Malaga, Spain
    Posts
    1,072
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    Paul O'B
    If you remove some settings you can start to see how this effect builds up.
    I've been looking at the simplified version (a lot), it is pretty complicated, i think I'm getting the idea behind it, although not completely, and to be honest it's extremely original.

  2. #52
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,624
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    So Paul when will the next quiz b? Is it a good one ?
    Always looking for web design/development work.
    http://www.CodeFundamentals.com

  3. #53
    Hibernator YuriKolovsky's Avatar
    Join Date
    Nov 2007
    Location
    Malaga, Spain
    Posts
    1,072
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    nice breather

  4. #54

  5. #55
    SitePoint Enthusiast
    Join Date
    Jan 2009
    Posts
    42
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Eric's Quiz A is very cool and relies on some interesting float behaviour in Firefox and IE8. (Opera and IE<=7 are a no-go.) I'll have to think carefully about whether this behaviour is CSS2.1-compliant; my guess is that it is, technically, but that not much thought was ever given to what would/should happen when the float is not in the same containing block as the paragraph and that the spec might need to be changed in light of this behaviour. (A couple of other issues in the CSS2.1 spec have recently come to light involving floats in different containing blocks.)

    The browser is trying, in left-to-right mode, to lay out the line boxes of the paragraph from left to right and from top to bottom, exactly as we're all familiar with: when it hits an obstruction (a right float or the right edge of the P) then the line box is terminated and a new one starts at the next available starting place underneath. (Only one line box is allowed at any given horizontal level.) The interesting thing is deciding where that starting place is.

    We know(?) that no line boxes are allowed to be to the left of a left float or to the right of a right float. We're accustomed to finding that the left float will be at the left of the P, and so the rule trivially applies in our everyday web pages and we give it no thought; but here the floats are hanging about in the middle and Fx and IE8 think the rule should still apply.

    In Paul's cut-down version of Eric's code there are some places where the leftmost float is a right float, which means a line box is permitted sit to the left of it; there are some places where the rightmost float is a left float, so a line box it permitted sit to the right of it; and there are other places where two floats sit side-by-side but neither is as just described, so no line box can sit on the same horizontal level as those two floats because of the rule described above. Hence the alternating text lines and blank lines in Paul's code.

    Since only one line box is allowed at any given horizontal level, Eric had to make cunning use of tiny line-heights etc to feign the effect so that when the text bleeds out of the tiny line boxes it visually appears at the same horizontal level on either side of the middle floats. Very clever, and worthy of an evil genius!

    [Incidentally, the browsers must have to decide where to test first for a possible line box starting position. Seemingly, Fx tries to start the line box at the left of the P, but if the leftmost float is a left float then the line box can't go there so Fx next tries to put it at the right. If it can't go there either then Fx moves the linebox down a bit and tries again. I wonder if Fx would test the right side first in a right-to-left document?]

  6. #56
    Hibernator YuriKolovsky's Avatar
    Join Date
    Nov 2007
    Location
    Malaga, Spain
    Posts
    1,072
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    agreed

  7. #57
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,380
    Mentioned
    180 Post(s)
    Tagged
    6 Thread(s)
    Very clever, and worthy of an evil genius!
    Yes, I think Erik's answer to the quiz I set is the top solution for all the quizzes we've had so far.

    Now all we have to do is get float:center implemented in the specs

  8. #58
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,278
    Mentioned
    50 Post(s)
    Tagged
    2 Thread(s)
    Very clever, and worthy of an evil genius!
    So... when is he going to announce those evil robots he's been working on? Oh wait, I wasn't supposed to say that--


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
  •