Center Alignment

This class will vertically center content within the section, column, or module.

alignment class

Usage

Add valign-center to the Section, Row, or Module Settings > Advanced tab > CSS ID & Classes > CSS Class.

Use with

Any Section, Row, or Module

Design

Nothing to configure here.

valign-center in sections

Add valign-center to the Section Settings > Advanced tab > CSS ID & Classes > CSS Class.

Examples

This is an example of a section vertically centering rows

valign-center in rows

Add valign-center to the Row Settings > Advanced tab > CSS ID & Classes > CSS Class.

Vertically Centered Text Module inside a Column

Vertically Centered Text Module inside a Column

Vertically Centered Text Module inside a Column

valign-center in modules

Add valign-center to the  Module Settings > Advanced tab > CSS ID & Classes > CSS Class.

Lorem ipsum dolor

This blurb’s title and text is vertically centered inside the whole blurb container. It’s also recommended to set a min-height:300px; on the blurb, or something similar to that.

Lorem ipsum dolor

This blurb’s title and text is vertically centered inside the whole blurb container. It’s also recommended to set a min-height:300px; on the blurb, or something similar to that.

Lorem ipsum dolor

This blurb’s title and text is vertically centered inside the whole blurb container. It’s also recommended to set a min-height:300px; on the blurb, or something similar to that.