uni-app grid布局在pc端小程序不生效？

uni-app grid布局在pc端小程序不生效？

开发环境 版本号 项目创建方式
Windows - HBuilderX

bug描述：

grid布局，在手机小程序上看，没问题，但是在电脑上打开小程序看，grid布局的代码，没生效

3 回复

grid 布局下架了吗？

更多关于uni-app grid布局在pc端小程序不生效？的实战教程也可以访问 https://www.itying.com/category-93-b0.html


是吗，不知道啊，后面在论坛看了下2年前就有这问题至今没解决，后面就没理这问题了

在PC端小程序中，grid布局不生效通常是因为部分小程序运行环境（如微信开发者工具或PC端微信）对CSS Grid的支持不完整或存在兼容性问题。建议尝试以下方法：

  1. 检查CSS兼容性写法
    确保grid属性添加了-ms-等前缀，例如：

    .container {
  display: -ms-grid;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  -ms-grid-columns: 1fr 1fr;
}

  2. 使用Flex布局降级方案
    若Grid仍不生效，可用Flex布局临时替代，通过媒体查询针对PC端单独调整：

    [@media](/user/media) (min-width: 768px) {
  .container {
    display: flex;
    flex-wrap: wrap;
  }
}
回到顶部