CSS random function

⚠ Browser differences

✗

✗

✗

✓

function supportsCssRandom() {
  if (
    !globalThis.CSS?.supports?.(
      "width",
      "random(fixed 0.5, 100px, 200px)"
    )
  ) {
    return false;
  }

  const probe = document.createElement("div");

  probe.style.cssText = `
    position: fixed;
    visibility: hidden;
    width: 1px;
    width: random(fixed 0.5, 100px, 200px);
  `;

  document.documentElement.append(probe);

  const computedWidth = parseFloat(getComputedStyle(probe).width);
  probe.remove();

  return computedWidth === 150;
}

supportsCssRandom()