CSS partial bleed utility

partial-bleed.css

/**
 * Iterating from Andy Bell's full-bleed CSS utility (https://hankchizljaw.com/wrote/creating-a-full-bleed-css-utility/)
 * simply set a max-width for those blocks you want to be wider than your centered prose column.
 * Useful if you have an image (or background image) that doesn't look good on massively wide viewports.
 */

.partial-bleed {
  width: 100vh;
  max-width: 1200px; /* example assumes your main prose max-width is e.g. 800px */
  margin-left: 50%;
  transform: translateX(-50%);
}