POM CSS helpers
POM Theme includes its site-building utility layer plus the Bootstrap utility/grid subset bundled by the theme. Use utilities for small, explicit layout decisions; use a named component class when several declarations describe one reusable design.
Administrators who intentionally need to replace the generated Helpers component can use Settings → POM Theme → Advanced → Custom CSS → Component CSS → Helpers and utilities. Use the global Custom CSS field for small additions or isolated overrides. The screen-reader-text accessibility rules belong to the separate Visibility and display utilities component and must be preserved when replacing it; see Display and visibility helpers.
Breakpoints
| Infix | Minimum width |
|---|---|
none / xs |
0 |
sm |
576px |
md |
768px |
lg |
992px |
xl |
1200px |
Responsive Bootstrap-style utilities apply from the named minimum width upward.
Topics
- Spacing and gap helpers
- Grid and column helpers
- Display and visibility helpers
- Alignment helpers
- Responsive variants
POM-specific examples
<div class="web-gap-2" aria-hidden="true"></div>
<img class="web-img-fit rounded" alt="…" src="…">
<section class="web-full-height">…</section>Available fixed spacer elements are web-gap-075, web-gap-125, web-gap-2, web-gap-3, web-gap-4, web-gap-8, and web-gap-12, representing the same values in rem. Prefer row/column spacing controls or CSS gap for structural layout—the spacer helper is most useful for simple legacy/template markup.
Other small helpers include hidden, clear, zi-0 through zi-5, zi-999, circle, rounded, web-img-fit, web-img-stretch, web-full-height, web-viewport, bg-transparent, dib, din and db.
Palette utilities are available as text-main-1 through text-main-15, bg-main-1 through bg-main-15, and border-main-1 through border-main-15. They resolve the corresponding --color-main-* property generated in Base and body, rather than embedding a second copy of each hexadecimal value. A complete Base replacement must retain every palette property required by the utilities used on the site.
Do not assume that every utility from a newer Bootstrap release exists. This chapter documents the utilities bundled by POM, not the complete external framework.