Relationship between display, position and float properties

The relationship and interaction between these three properties that control the box generation and elements layout, display, position and float is explained in the following section:

1. If display property has value none, then position and float properties do not apply; the element "does not exist" and therefore generates no boxes.
2. If the position property has value absolute or fixed, the box is absolutely positioned, the computed value of float is none and the display value is as shown in the table below, the position of the box is determined only by he properties top, right, bottom and left.
3. If the float property value is other then none, the box will be floated and the display will be set according to the table below.
4. If the element is the root element, the display property will be set according to the table below.
5. In all other cases the display property applies as specified.

The display property value comparison table:

›› go to examples ››