...
The effects of this are not too bad: using the per-component classes (see below) you can more easily address styling of html tags used in the components and reset them only where needed. In addition DomUI mostly uses the styleless div and span tags, and just adds styling by giving those a class where needed.
The box model used is border-box.
The default (original) box model used by browsers leaves a lot to be desired. When you specify something like:
Code Block |
---|
height: 100px;
width: 200px;
padding: 10px;
border: 2px solid black; |
the actual width of the element is padding + border + width. The same applies to height: padding + border + height. This makes defining the actual size of element very hard because adding a border means decreasing the size if the element's size needs to be constant. It also causes huge problems with things like "width: 100%" because those cannot have border nor padding: it would make the element exceed the 100% width causing those annoying scroll bars.
There is a better box model that is currently well supported by all major browsers (and IE up to version 8): the border-box model. This model uses the defined width and height of an element as the actual rendered size, and subtracts from that size the sizes of borders and padding to get the content area's size. In effect this means that the above definition would always result in an element of exactly 200x100 pixels wide. The content area (inside the element) would be exactly 176x76 pixels big: 200 - 2*2 - 2*2 for width and the similar calculation for height.
The script used for this is in _core.scss, and applies the following:
Code Block | ||
---|---|---|
| ||
html {
box-sizing: border-box;
}
*, *:before, *:after {
box-sizing: inherit;
} |
This sets all tags to use border-box sizing by default, and makes it inherit so that changes made locally (should) percolate through.
See the following links for more information:
Browser support and tweaks
...
In those times of yore we had browsers and Internet Explorer. The latter was, well, evil. Supporting IE versions below 8 was , well, what Hell probably looks like. Luckily a lot has changed: while IE is still a royal pain in the backside (you won't believe the trouble it has with the simplest stuff still) its rendering, at least, has become way better.
...