[[!meta title="Spec/HTML5 Alignment"]]
[[!meta author="James Bursa"]]
[[!meta date="2011-11-26T22:20:33Z"]]
[[!toc]] The way HTML's align
attribute interacts with CSS properties is only really explained in the
HTML5 spec. However, the explanation there is quite opaque. Here there
is a clearer version with more explanation.
Spec
----
| When a user agent is to align descendants of a node, the user
| agent is expected to align only those descendants that have both
| their 'margin-left' and 'margin-right' properties computing to a
| value other than 'auto', that are over-constrained and that have
| one of those two margins with a used value forced to a greater
| value, and that do not themselves have an applicable align
| attribute.
-- HTML5 10.2.4 original
Simplified:
| When a user agent is to align descendants of a node, the user agent
| is expected to align only those descendants that:
|
| 1 have both their 'margin-left' and 'margin-right' properties
| computing to a value other than 'auto',
|
| 2 are over-constrained, and that have a left or right margin with
| a used value forced to a greater value, and
|
| 3 do not themselves have an applicable align attribute.
-- tlsa's interpretation
I have separated the sentence where I think the criteria are and made it
more clear.
Further explanation
-------------------
### Criterion 1 detail:
A box that doesn't have either left, right, or both left & right margins
set to 'auto', to align the box "the CSS way".
### Criterion 2 example:
#example2 { width:200px;
margin-left: 0;
margin-right: 0; }