Differences
This shows you the differences between two versions of the page.
| Next revisionBoth sides next revision |
| ideas:box-model-extensions [2010/12/28 17:12] – created tabatkins | ideas:box-model-extensions [2011/08/19 17:48] – [Size Keywords] copyedit crissov |
|---|
| |
| ===== Size Keywords ===== | ===== Size Keywords ===== |
| The 'auto' keyword for width and height resolve to interesting values based on context, which can't be duplicated elsewhere. For example, tables and floats resolve 'auto' using the "shrinkwrap" algorithm, while normal blocks use a "fill" algorithm to fill their parent as much as possible. | The ''auto'' keyword for width and height resolve to interesting values based on context, which can't be duplicated elsewhere. For example, tables and floats resolve ''auto'' using the "shrinkwrap" algorithm, while normal blocks use a "fill" algorithm to fill their parent as much as possible. |
| |
| These behaviors should be explicitly named so they can be used generally: | These behaviors should be explicitly named so they can be used generally: |
| * 'fill': The normal width of a display:block element, where it fills its parent. | * ''fill'': The normal width of a display:block element, where it fills its parent. |
| * 'min-content': The width of a box if you take all optional linebreak opportunities. | * ''min-content'': The width of a box if you take all optional linebreak opportunities. |
| * 'max-content': The width of a box if you take no optional linebreak opportunities. | * ''max-content'': The width of a box if you take no optional linebreak opportunities. |
| * 'fit-content': min(max-content, fill) | * ''fit-content'': ''min(max-content, fill)'' |
