Sizing Utilities

Make an element as wide or as tall as you need using width and height utilities.

Width and height utilities provide support for 25%, 50%, 75%, 100%, and auto by default.

Width

Height

Max Width

Max Height

Viewport Relative Sizing

You can also use utilities to set the width and height relative to the viewport.

<div class="_width:100vw">100% Viewport Width</div>

<div class="_height:100vh">100% Viewport Height</div>

<div class="_max-width:100vw">100% Viewport Max Width</div>

<div class="_max-height:100vh">100% Viewport Max Height</div>