.stackContent
nodes always wrap content. They are block level and therefore are the full width of their parent.
The next three nodes are .stackAuto
which applies width:auto
to them. If you reduce the window width they will automatically stack vertically:
.stackAuto
.stackContent
.stackAuto
.stackContent
.stackAuto
.stackContent
vertical-align:middle
applied to them:
.stack1of2
.stackContent
.stack1of2
.stackContent
.stack1of2
.stackContent
.stack1of2
.stackContent
.stack1of6
in the CSS but I never use it because 1/6 width nodes are severly affected by the decimal rounding error in some browsers, especially when nested.
.stack1of3
.stackContent
.stack1of3
.stackContent
.stack1of3
.stackContent
.stack1of3
.stackContent
.stack2of3
.stackContent
.stack1of4
.stackContent
.stack1of4
.stackContent
.stack1of4
.stackContent
.stack1of4
.stackContent
.stack1of4
.stackContent
.stack1of4
.stackContent
.stack1of4
.stackContent
.stack1of4
.stackContent
.stack3of4
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack4of5
.stackContent
.stack2of5
.stackContent
.stack3of5
.stackContent
.stackContent
nodes always wrap content. They are block level and therefore are the full width of their parent. In this case the parent is the outer wrapper of the entire stack which is also a
The two nodes below are also .stackAuto
which applies width:auto
to them. If you reduce the window width they will automatically stack vertically:
.stackAuto
.stackContent
.stackAuto
.stackContent
.stackAuto
.stackContent
vertical-align:middle
applied to them:
.stack1of2
.stackContent
.stack1of2
.stackContent
.stack1of2
.stackContent
.stack1of6
in the CSS but I never use it because 1/6 width nodes are severly affected by the decimal rounding error in some browsers, especially when nested.
.stack1of3
.stackContent
.stack1of3
.stackContent
.stack1of3
.stackContent
.stack1of3
.stackContent
.stack2of3
.stackContent
.stack1of4
.stackContent
.stack1of4
.stackContent
.stack1of4
.stackContent
.stack1of4
.stackContent
.stack1of4
.stackContent
.stack1of4
.stackContent
.stack1of4
.stackContent
.stack1of4
.stackContent
.stack3of4
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack4of5
.stackContent
.stack2of5
.stackContent
.stack3of5
.stackContent
.stackContent
nodes always wrap content. They are block level and therefore are the full width of their parent. In this case the parent is the outer wrapper of the entire stack which is also a
The two nodes below are also .stackAuto
which applies width:auto
to them. If you reduce the window width they will automatically stack vertically:
.stackAuto
.stackContent
.stackAuto
.stackContent
.stackAuto
.stackContent
vertical-align:middle
applied to them:
.stack1of2
.stackContent
.stack1of2
.stackContent
.stack1of2
.stackContent
.stack1of6
in the CSS but I never use it because 1/6 width nodes are severly affected by the decimal rounding error in some browsers, especially when nested.
.stack1of3
.stackContent
.stack1of3
.stackContent
.stack1of3
.stackContent
.stack1of3
.stackContent
.stack2of3
.stackContent
.stack1of4
.stackContent
.stack1of4
.stackContent
.stack1of4
.stackContent
.stack1of4
.stackContent
.stack1of4
.stackContent
.stack1of4
.stackContent
.stack1of4
.stackContent
.stack1of4
.stackContent
.stack3of4
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack1of5
.stackContent
.stack4of5
.stackContent
.stack2of5
.stackContent
.stack3of5
.stackContent
.stackContent
nodes always wrap content. They are block level and therefore are the full width of their parent. In this case the parent is the outer wrapper of the entire stack which is also a
The two nodes below are also .stackAuto
which applies width:auto
to them. If you reduce the window width they will automatically stack vertically:
.stackAuto
.stackContent
.stackAuto
.stackContent
.stackAuto
.stackContent
vertical-align:middle
applied to them:
.stack1of2
.stackContent
.stack1of2
.stackContent
.stack1of2
.stackContent
.stack1of6
in the CSS but I never use it because 1/6 width nodes are severly affected by the decimal rounding error in some browsers, especially when nested.
.stack1of3
.stackContent
.stack2of3
.stackContent
.stack1of4
.stackContent
.stack3of4
.stackContent
.stack1of5
.stackContent
.stack4of5
.stackContent
.stack2of5
.stackContent
.stack3of5
.stackContent