Box acts as a wrapper to any element and/or content. You may manipulate its position, set height, and limit the max width.
Box
Equal Height
Optimize your grid layout to the next level with equal-height box
Reference Box
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras consectetur metus sed elit scelerisque, quis porta arcu venenatis. Mauris cursus est sed tortor condimentum convallis.
Aliquam sit amet euismod magna. Donec aliquam lectus a justo pretium rutrum. Curabitur molestie pulvinar risus id varius. Aliquam aliquet ultrices tortor, vel faucibus lectus suscipit quis. Proin tristique est urna, ut dignissim nunc eleifend et. Etiam feugiat a mi at aliquam.
Nunc non consequat quam. Donec non mollis augue. Sed nec euismod lectus, sodales scelerisque arcu. In id nunc turpis. Nam aliquam mi in blandit luctus. Aliquam erat volutpat. Fusce nec risus vehicula, dignissim nibh eget, convallis erat.
Equal-height Box
Architecture
Equal-height box linked to small image height
Lifestyle
Equal-height box linked to big image height
Background
Wrap elements with custom background color or image.
Feature in Box
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque vitae felis at urna aliquet posuere quis eu urna. Proin et pulvinar dolor. Phasellus ultrices eleifend justo.
Feature in Box
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque vitae felis at urna aliquet posuere quis eu urna. Proin et pulvinar dolor. Phasellus ultrices eleifend justo.
Vertical Align
With height options, you set the vertical alignment that fit to your layout.
TOP
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque vitae felis at urna aliquet posuere quis eu urna. Proin et pulvinar dolor. Phasellus ultrices eleifend justo.
MIDDLE
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque vitae felis at urna aliquet posuere quis eu urna. Proin et pulvinar dolor. Phasellus ultrices eleifend justo.
BOTTOM
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque vitae felis at urna aliquet posuere quis eu urna. Proin et pulvinar dolor. Phasellus ultrices eleifend justo.
Extend Background
Extend background to left and right while content still fit in container.
Half Column Box
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi ac nulla nisi. Praesent venenatis sapien eget risus consectetur pulvinar. Fusce dolor leo, feugiat nec sem in, euismod mollis odio. Pellentesque elementum semper nulla.
Half Column Box
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi ac nulla nisi. Praesent venenatis sapien eget risus consectetur pulvinar. Fusce dolor leo, feugiat nec sem in, euismod mollis odio. Pellentesque elementum semper nulla.
Transparency
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi ac nulla nisi. Praesent venenatis sapien eget risus consectetur pulvinar. Fusce dolor leo, feugiat nec sem in, euismod mollis odio. Pellentesque elementum semper nulla, non efficitur justo ullamcorper eget.