On May 26, 11:47 pm, Boris Zbarsky <[email protected]> wrote: > Emanuele D'Arrigo wrote: > > <div id="div1"> > > <div id="div2"> > > <div id="div3" width="45px" style="display:inline">Meoow</div> > > <div id="div4" width="50%" style="display:inline">Wooof</div> > > </div> > > </div> > > I'm going to assume you meant to not put in the "display:inline" part, > and meant style="width: 45px" and such...
Errrr... <cough><cough>... ahem... I did mean it like that...sorry. I didn't test it though. Is it just bad practice or is there something actually wrong? I could have written it like this I guess: <div id="div4" style="width:50%; float:left">Wooof</div> Is that simply more "up to standards" or are there problems with my first version? > "It depends". In the CSS box model, div1 knows how wide it will be. It > gives that information to div2, which then decides how wide it will be. > It gives that information to div3 and div4, which then decide how > wide they will be, then how tall, and pass that information to div2. It > decides how tall it will be, then passes that information to div1 and > layout is done when div1 decides how tall it is. A-ha! So I did get it almost entirely the other way around. Ok, very good, much clearer now. Thank you. > Seehttp://www.w3.org/TR/CSS21/visudet.htmlfor more details (including > all the complicated cases, etc). Yep, I had read that document (and many others!) but I was a little overwhelmed by the amount of information. Your description above clarifies everything much more succinctly! > In the XUL flexbox model, behavior is significantly more complicated, of > course, since both widths and heights are output... I didn't know the XUL model had a name! I googled it and found and read the CSS3 editor's draft on the matter. Thank you. Do you think that eventually this model will replace the way block boxes and inline boxes are handled? And why do you say the flexbox model is more complicated? It seems simpler to me, as in more consistent, less special cases, with both horizontal and vertical arrangement of child boxes being fundamentally handled the same way. Furthermore XUL seems to handle only px, em and ex (even though I thought it should handle percentages too (*) ). That should simplify a thing or two, shouldn't it? Manu (*) I.e. this doesn't work the way I'd expect it to work - the inner box width is collapsed to 0 pixels instead of taking half the width of the outer box: <box style="border:1px solid orange; overflow:visible;" align="start"> <box style="width:50%; height:100px; border:1px solid red; padding: 0px; margin:15px"></box> </box> _______________________________________________ dev-tech-layout mailing list [email protected] https://lists.mozilla.org/listinfo/dev-tech-layout
