Background Repeat

Utilities for controlling the repetition of an element's background image.

Class	Properties
.bg-repeat	background-repeat: repeat;
.bg-no-repeat	background-repeat: no-repeat;
.bg-repeat-x	background-repeat: repeat-x;
.bg-repeat-y	background-repeat: repeat-y;

Repeat

Use .bg-repeat to repeat the background image both vertically and horizontally.

No Repeat

Use .bg-no-repeat when you don't want to repeat the background image.

Repeat Horizontally

Use .bg-repeat-x to repeat the background image only horizontally.

Repeat Vertically

Use .bg-repeat-y to repeat the background image only vertically.

Variants

By default, only responsive variants are generated for this utility. You can control which variants are generated by modifying the $utility-configuration in _settings.scss.