登录 立即注册

首页 > 绿虎论坛 > 软件开发 > 编程语言 > HTML/CSS/JS (发帖)

标题: 遇到这样一个css问题overflow-x: scroll

作者: @Ta

时间: 05-25 10:21发布,05-25 10:22修改

点击: 4421

案例:一排滑动图片

display: flex;
overflow-x: scroll;

下面用林子的表情演示

当我将一列图片摆成一排,正常浏览器会显示出来,比如edge和chrome
S40525-10125473_com.microsoft.emmx.png(349.29 KB)

魅族自带的浏览器会这样挤在一起,除非你手动去触发一次css改变比如border,width之类的才会恢复,浏览器内核是Gecko,是什么原因导致的呢
S40525-10124168_com.android.browser.png(445.71 KB)


[隐藏样式|查看源码]


『回复列表(12|隐藏机器人聊天)』

1.

@echo醉老仙,你能用

[html]
代码
[/html]

写一个完整的例子吗?

(/@Ta/2024-05-27 09:06//)

2.
层主 @然若 于 2024-06-16 15:55 删除了该楼层。
(/@Ta/2024-05-27 09:27//
被锁定
)

3.
(/@Ta/2024-05-27 13:29//)

4.
层主 @然若 于 2024-06-16 15:55 删除了该楼层。
(/@Ta/2024-05-27 14:08//
被锁定
)

5.

@然若,可能是吧
S40527-14111232_com.android.browser.png(437.71 KB)

(/@Ta/2024-05-27 14:13//)

6.

@echo醉老仙,via浏览器(系统webview,基于chromium),同样的html代码,@消息里就是拉伸的,帖子里就正常:
Screenshot_20240527_161154_mark.via.jpg(664.39 KB)
Screenshot_20240527_161247_mark.via.jpg(533.02 KB)

(/@Ta/2024-05-27 16:15//)

7.

@echo醉老仙,你看看你的@消息里是不是拉伸的

HTML代码

(/@Ta/2024-05-27 16:17//)

8. 这个矩阵
display: flex;
(/@Ta/2024-05-27 16:28//)

9.
层主 @然若 于 2024-06-16 15:55 删除了该楼层。
(/@Ta/2024-05-27 17:18//
被锁定
)

10.

@老虎会游泳,帖子和提醒,edge不拉伸,魅族自带浏览器拉伸,这里没有设定图片高度,在别的项目中已经固定宽高也依然是这样

(/@Ta/2024-05-27 18:41//)

11.

@echo醉老仙,你试试设置成max-height: 64px这样

(/@Ta/2024-05-27 19:05//)

12.

@老虎会游泳,你这么一说,我灵光一闪,设置了min-width,貌似解决了,我的项目中并没有遇到图片高度问题,而是被挤压的状态,图片并没有撑开应有的宽度,现在设置后正常了

(/@Ta/2024-05-27 20:12//)

回复需要登录

6月29日 14:26 星期六

本站由hu60wap6华为CPU驱动

备案号: 京ICP备18041936号-1