Re: [css-d] Basic questions about the box model

[Georg]

Den 12.08.2017 20.52, skrev Ezequiel Garzón:

Georg, while I haven't gone over the standard in depth, I assumed the
rendering I saw in all browsers was compliant, and in that sense
logical and expected. I was shooting for something along the lines of
why you think it was defined this way.


Well, I do not even know if that particular behavior was /intentionally/ 
/defined/, or if it came about by accident...


Look at it this way: the first browsers was developed without much of 
what we may call "standards", and there was _no_ CSS to begin with. 
Standards came later, and those first standard bodies simply picked up 
what there was some agreement about between competing browser 
developers, and mainly wrote "status quo" at the time into standards for 
HTML.
Even later, when the first - basic - CSS standards was formulated, they 
kept on building those on "status quo" in the browser world, while 
trying to refine these standards in such a way that browser developers 
would come on board and actually develop browsers that (more or less) 
followed the same standards, in order to achieve interoperability.
Lots of "less logical solutions" got dropped as standards organs - 
mainly the W3C - wrote and cleaned up standards, but there are still 
plenty "less logical" stuff left in today's standards from way back in 
the browser war era. Some of the old stuff is also left in today's 
standards to assure that new browsers that /follow /standards can render 
quite old pages /somewhat/ acceptable.


So, I don't know /who /- once upon a time - defined this particular 
behavior - some browser developer or a standard body, or /why/ they did 
it. Clearly noone has found good reasons to change it over the years, so 
now we are kind of stuck with it. As standards have evolved to provide 
us with ways to code around and/or avoid old behaviors that we don't 
like, it should not cause us any real problems for us today.


regards
Georg
__
css-discuss [css-d@lists.css-discuss.org]
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/

Re: [css-d] Basic questions about the box model

[Ezequiel Garzón]

Thank you Georg and Jay for your replies, and my apologies for not
saying anything until now.

Georg, while I haven't gone over the standard in depth, I assumed the
rendering I saw in all browsers was compliant, and in that sense
logical and expected. I was shooting for something along the lines of
why you think it was defined this way.

Maybe one day I'll study the (CSS 2) standard, and maybe I will find
out the rationale behind this decision, though I guess it's a better
bet to read the designers' book, "Cascading Style Sheets: Designing
for the Web", or Wium Lie's PhD thesis, wiumlie.no/2006/phd.

Jay, I don't see what you're telling me. If I add "* { box-sizing:
border-box }" to my CSS I get the same result.

Thank you both once again. Cheers!

On Wed, Aug 9, 2017 at 10:36 PM, Jay Tanna  wrote:
> You can avoid all the problems of box model by using box-sizing.  I suggest 
> read this Mozilla (MDN) article:
>
> 
>
> After using this, I don't have to worry about something not fitting in a DIV. 
>  This is what original Microsoft IE6, IE7 and IE8 used to do (i.e they 
> misinterpreted box model) but people said it is wrong so now we have 
> box-sizing.  Microsoft won here as far as I am concerned.
>
>
>
>
> 
> On Mon, 7/8/17, Ezequiel Garzón  wrote:
>
>  Subject: [css-d] Basic questions about the box model
>  To: "css-discuss" 
>  Date: Monday, 7 August, 2017, 0:41
>
>  Greetings to all! I can see I'm not
>  understanding the box model
>  correctly considering this basic
>  example:
>
>  
>  #green {
>  background-color: green;
>  width: 100px;
>  height: 100px;
>  float: left;
>   }
>  #red {
>  background-color: red;
>  width: 100px;
>  height: 100px;
> }
>  
>id="green">Green
>  Red
>
>  I can understand that the "green"
>  floated div is blocking the "red"
>  div, and therefore we don't see any
>  red. Well, I can frankly sort of
>  understand it, because it's floated
>  after all, but what puzzles me the
>  most by far here is the fact that they
>  are the same size and yet we
>  can see the word "Red" below the green
>  square. Wouldn't it make more
>  sense for the word "Red" not to be
>  visible at all, considering it
>  comfortably fits its hidden box? I'm
>  sure the specs dictate this
>  behavior, but I'm looking for some
>  rationale, specially given that
>  overlaps and hidden stuff are quite
>  common in CSS, if not the desired
>  result.
>
>  Thanks in advance.
>
>  Cheers,
>
>  Ezequiel
>  __
>  css-discuss [css-d@lists.css-discuss.org]
>  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/
__
css-discuss [css-d@lists.css-discuss.org]
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/