React PhotoSwipeGallery仅是一栏

如何解决React PhotoSwipeGallery仅是一栏

在使用react-photoswipe（https://www.npmjs.com/package/react-photoswipe）并尝试按示例使用photoswipe gallery时...画廊最终变成一列。

let items = props.framesPaths.map((filename) => {
    return {
        src: 'https://example.com/' + props.folderName + '/' + filename,thumbnail: 'https://example.com/' + props.folderName + '/' + filename,w: 1200,h: 900,title: filename
    }
})

const getThumbnailContent = (item) => {
    return (
        <img src={item.thumbnail} width={120} height={90} />
    );
}


return <photoswipegallery items={items} thumbnailContent={getThumbnailContent} />

它位于一个看起来像这样的容器中：

     <Grid item xs={12} align="center">
            <Paper className={`${classes.mediaFrame}`} elevation={10} align='center' square>
                <Typography variant={'h6'}>All frames ({frames.length})</Typography>
                <Framesgallery framesPaths={frames} folderName={cameraFolderName(cam)} />
            </Paper>
    </Grid>

适用的类别是：

mediaFrame: {
        display: 'inline-block',maxWidth: '90%',padding: '5px',paddingLeft: '25px',paddingRight: '25px',justify: 'center'
    },media: {
        width: '100%',},

问题是输出看起来像这样：

在包含的纸张上添加最小宽度90％的图像，可以得到相同的视图，但缩略图位于更宽的“纸张”元素中间。