Tudor Hariton wrote: > Highpowered wrote: >> Reese wrote: >> >>> I'm faced with an issue I worked around once before, it presents >>> again with a new face so I'd like to find an ultimate cure, not >>> make do with the cheesy work-around. >>> >>> I need a div container with div-class items that auto-fill left >>> or right. Such that: >>> Item1 seeks top-left position(possibly unique ID but this should >>> be a source code issue - if it's at the top of the stack then it >>> is at the top of the stack), >>> Item2 fills a right position only if the left is non-empty, >>> Item3 fills a right position only if the left is non-empty, >>> Item4 fills a right position only if the left is non-empty, etc. >>> >>> The goal is left-to right recursive, in rows. >>> >>> Below, a crude ascii graphic. I've been through the CSS so many >>> times and changed so many things, I'm getting lost and I'd like >>> to start over. What can I do, to make "item" elements auto-fill >>> in rows starting from top-left? >>> >>> Reese >>> >>> --------------------------------------------------------------/ >>> |Logo | Header content area / >>> |Area | / >>> |-------------------------------------------------------------/ >>> |Left | ----------------------- ------------------------- / >>> |Nav | | Item 1 || Item 2 |/ >>> |Menu | | || |/ >>> |Item | | || |/ >>> |Area | | || |/ >>> | | | || |/ >>> | | | || |/ >>> | | ----------------------- -------------------------|/ >>> | | | Item3 || Item 4 |/ >>> | | | || |/ >>> | | | || |/ >>> | | | || |/ >>> | | | || |/ >>> | | | || |/ >>> | | ----------------------- -------------------------|/ >>> | | | Item 5 || Item 6 |/ >>> | | | || |/ >>> | | | || |/ >>> | | | || |/ >>> | | | || |/ >>> ctrl^v >>> >> Have you tried using a <ul> to contain each Item as an <li>, and >> assigning definite dimensions to the <li>s and floating them left, or >> assigning display:inline to the <li>s? With each Item/<li> in either >> case, they will flow like that. >> >> Starting with that in mind, you could take it further, and I'm thinking >> that what you want is a bit more complicated, and I've oversimplified or >> not understood what you're asking. I apologize for that if I have done that. >> >> -HP >> > If I understand it right... you could do this with every "item" in a div > with float: left;
You could, but surely as they're labeled "Item x" in the diagram, it's more suited to a list, anyway :) Chris. ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
