代码之家 › 专栏 › 技术社区 › assembler

css如何在可调整大小的面板中显示水平滚动条以溢出div的内容

resize reactjs css

assembler · 技术社区 · 5 年前

我下载了一个Reactjs组件来容纳几个面板( https://www.npmjs.com/package/react-panelgroup )并调整它们的大小,但我需要可调整大小面板的内容在容器大于其最大宽度时拉伸,在容器较短时显示滚动条。

但我得到的却是:

这是我所拥有的:

<PanelGroup
        direction="row"
        spacing={5}
        panelWidths={[
          { size: 500, minSize: 125, resize: 'dynamic' },
          { size: 500, minSize: 125, resize: 'dynamic' },
          { minSize: 200, resize: 'stretch' }
        ]}
      >
        <div><div style={{ width: `${first}px`, minWidth: `${Math.trunc(first/4)}px`, overflow: 'auto'}}>panel sasasa asa fa fdd dfds af dasfds  df dfas sf df sdafds1</div></div>
        <div>paneldsfd fsd sdfsd fsdf sdfds fasf  2</div>
        <div>panelsdaf sdfdasfsfs sdf sd 3</div>
      </PanelGroup>

我需要的不是包装内容,而是滚动容器。有什么建议吗?