Content

Content
- area for text and buttons

content-padding

spacing inside area

content-padding-small
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.

More Info More Info

content-padding
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.

More Info More Info

content-padding-large
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.

More Info More Info

content-padding-huge
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.

More Info More Info

content-align (vertical)

vertical alignment of text and buttons

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
content-align-top (default)
Lorem ipsum dolor sit amet

More Info More Info
content-align-middle
Lorem ipsum dolor sit amet

More Info More Info
content-align-bottom
Lorem ipsum dolor sit amet

More Info More Info
content-align-spaced
Lorem ipsum dolor sit amet

More Info More Info

content-align (horizontal)

horizontal alignment of text and buttons

(default)
default, the content is 100% wide

More Info

content-align-left
Lorem ipsum dolor sit

More Info

content-align-center
Lorem ipsum dolor sit

More Info

content-align-right
Lorem ipsum dolor sit

More Info

content-horizontal

text and buttons side-by-side

content-horizontal
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

More Info More Info

content-horizontal-reverse
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

More Info More Info

+ content-align-bottom
+ content-align-spaced
example of
align-classes
added to
horizontal layouts

More Info More Info

content-minheight

minimum height of the content

content-minheight-120
content-minheight-240
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

More Info More Info
content-minheight-360
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

More Info More Info
content-minheight-480
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

More Info More Info
content-minheight-600
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

More Info More Info
content-minheight-screen
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.

More Info More Info

content-maxwidth

limit the width of the content

content-maxwidth-860
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

More Info More Info
content-maxwidth-640
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

More Info More Info
content-maxwidth-420
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

More Info More Info

content-padding

content-padding-small

content-padding

content-padding-large

content-padding-huge

content-align (vertical)

content-align-top (default)

content-align-middle

content-align-bottom

content-align-spaced

content-align (horizontal)

(default)

content-align-left

content-align-center

content-align-right

content-horizontal

content-horizontal

content-horizontal-reverse

+ content-align-bottom

+ content-align-spaced

content-minheight

content-minheight-120

content-minheight-240

content-minheight-360

content-minheight-480

content-minheight-600

content-minheight-screen

content-maxwidth

content-maxwidth-860

content-maxwidth-640

content-maxwidth-420