微信这什么玩意？浏览器显示差异问题，求解

[sorakylin]

微信打开一个项目的详情页的话，图片就会被拉伸（拉伸到手机宽度），很迷，没太懂微信这内置的浏览器是个什么机制。

正常从手机浏览器打开是没问题的。

我做的，有的时候是得从微信分享，所以还是想解决这个问题。

各位老哥麻烦看看，网站是： https://xquan.net

---

手机端自适应的给 image box 设置了

• height: 54.5vw;
• max-width：100%

没设置 width ，就只想固定个高度，让宽度自适应。

其他的自适应倒也没发现有什么问题，就这个详情页的画廊图片宽度给我整懵了。

---

主要是我也不好调试…… 难道得下个小程序开发工具打开网页去调试？也不知道行不行。

对比：

这是同一个项目。看画廊部分，图片展示问题

[dfkjgklfdjg]

考虑加一个 `width:auto` 试试看？微信内置的浏览器确实问题比较大，需要单独做一些适配的。
如果能下微信开发者工具调试肯定是最好的。

[sorakylin]

@dfkjgklfdjg 了解了，看来还是得整个开发者工具😂

[okakuyang]

搜索“微信 x5 调试”因为安卓上微信内的 webview 用的是 x5 ，是腾讯修改 webkit 的一个版本。表现上会与 chrome 系列 webview 有差异。

[maotao456]

@dfkjgklfdjg 微信开发者工具似乎是没用的， 我曾经一个 css 兼容问题只有真机才会出现。

[dfkjgklfdjg]

@maotao456 #4 ，嗯，确实，但是总比没办法调试来得好一些，虽然很多兼容问题都只能靠经验推测出来。

[xiqishow]

@maotao456 #4 确实 开发工具走的是一个内核 就能预览个大概 还是要在设备上看实际效果 比如 flex 的 gap 属性 在工具预览没问题 iOS13 由于自身浏览器核心的问题 就是不支持