Open
Description
Describe the bug
When using centered
layout and inlined: false
for docs story, the iframe inside docs preview has a fixed width (~320px) and does not fill its container.
{
layout: 'centered',
docs: {
story: {
inline: false
}
}
}
If the component width is greater than 320px, the iframe overflows and scrollbars are displayed.

To Reproduce
https://stackblitz.com/edit/github-qsqk9f?file=src%2Fstories%2FButton.stories.ts
System
Storybook Environment Info:
System:
OS: Linux 5.0 undefined
CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
Shell: 1.0 - /bin/jsh
Binaries:
Node: 18.18.0 - /usr/local/bin/node
Yarn: 1.22.19 - /usr/local/bin/yarn
npm: 9.4.2 - /usr/local/bin/npm <----- active
pnpm: 8.10.5 - /usr/local/bin/pnpm
npmPackages:
@storybook/addon-essentials: ^8.0.0-alpha.5 => 8.0.0-alpha.6
@storybook/addon-interactions: ^8.0.0-alpha.5 => 8.0.0-alpha.6
@storybook/addon-links: ^8.0.0-alpha.5 => 8.0.0-alpha.6
@storybook/addon-onboarding: ^1.0.10 => 1.0.10
@storybook/blocks: ^8.0.0-alpha.5 => 8.0.0-alpha.6
@storybook/react: ^8.0.0-alpha.5 => 8.0.0-alpha.6
@storybook/react-vite: ^8.0.0-alpha.5 => 8.0.0-alpha.6
@storybook/test: ^8.0.0-alpha.5 => 8.0.0-alpha.6
storybook: ^8.0.0-alpha.5 => 8.0.0-alpha.6
Additional context
No response