时间戳

首页 > 解决方案 > flex 不能使设计响应

css - flex 不能使设计响应

问题描述

我在我的应用程序中使用 React Material 组件，以使其响应我尝试使用的各种屏幕尺寸flex。下面是我的代码

<div style={{ display: 'flex', flexWrap: 'wrap', flexWrap: "wrap" }}>
     <div style={{ flexGrow: 1, flexBasis: "25%" }}>
      <Chip />
     </div>
    <div style={{ flexGrow: 1, flexBasis: "25%" }}>
      <Chip />
     </div>
   <div style={{ flexGrow: 1, flexBasis: "25%" }}>
      <Chip />
    </div>
   <div style={{ flexGrow: 1, flexBasis: "25%" }}>
      <Chip />
   </div>
 </div>

在上面的代码Chip中是一个来自Material Ui. 随着屏幕尺寸的减小，上面的代码不会使芯片下降（响应）。怎么了？

标签： cssreactjsresponsive-designflexboxmaterial-design

解决方案

推荐阅读