Sizing

The Phoenix Prediction iframe supports two sizing modes.

Container Sizing

Container sizing is the default (?sizing=container, or any value other than auto). Your page controls the iframe dimensions, and Phoenix scrolls internally when content is taller than the frame.

<iframe
  src="https://embed.prediction.phoenixverse.io/o/acme?sizing=container&token=JWT"
  style="width: 100%; height: 720px; border: 0"
></iframe>

Use container sizing for:

• Game-style pages
• Sportsbook tabs
• Sidebars
• Modals
• Fixed widgets
• Mobile full-screen placements

Auto Sizing

Auto sizing lets the iframe tell the parent page how tall its content is. Enable it with ?sizing=auto:

<iframe
  src="https://embed.prediction.phoenixverse.io/o/acme?sizing=auto&token=JWT"
  style="width: 100%; border: 0"
></iframe>

The iframe measures its own content, not the frame around it, and sends a resize event over the parent bridge when it starts and whenever that height changes, with the content height in pixels. The height follows the content both ways: the frame grows when a tall page opens, such as a market page, and shrinks again for a short one, such as the leaderboard. In auto sizing the embed has no minimum height of its own.

{ v: 1, ns: 'pmm', kind: 'event', name: 'resize', payload: { height: 1180 } }

If you use the Host SDK, it applies the height for you. With the raw bridge, apply it only after the usual checks (see Parent Bridge):

const phoenixOrigin = 'https://embed.prediction.phoenixverse.io';

window.addEventListener('message', (event) => {
  if (event.origin !== phoenixOrigin || event.source !== iframe.contentWindow) return;
  const m = event.data;
  if (m?.ns === 'pmm' && m.v === 1 && m.kind === 'event' && m.name === 'resize') {
    iframe.style.height = `${m.payload.height}px`;
  }
});

Until the first resize arrives, the iframe has the browser's default height, so give it a sensible min-height.

Use auto sizing for article-like or lobby-like placements where inner iframe scrolling would feel awkward.

Recommendation

Start with container. Move to auto only when the embed is part of a longer parent page and you want one continuous scroll.