溢出x：滚动不工作 [英] Overflow-x : scroll not working

问题描述

我有一个div与浮动（左）图像里面，但 overflow-x：scroll; 似乎不工作..

I have a div with floating (left) images inside, but the overflow-x : scroll; appears to not work..

这是我的容器：

.browse-gallery {
    width: 100%;
    height: 110px;
    overflow-x: scroll;
    overflow-y: hidden;
    border-top: 7px solid #585453;
    background: #585453;
    white-space: nowrap;
    float: left;
}

和图片：

.browse-gallery img {
    width: 109px;
    height: 81px;
    display: block;
    border-top: none;
    float: left;
    position: relative;
    cursor: pointer;
    margin-right: 5.7px;
    white-space: nowrap;
}

我如何解决这个问题？谢谢。

How can I solve this ? Thank you.

推荐答案

移除浮动并添加display：inline-block： 演示

Remove float and add display:inline-block: Demo

.browse-gallery img {
        width: 109px;
        height: 81px;
        display: inline-block;
        border-top: none;
        /*float: left;*/
        position: relative;
        cursor: pointer;
        margin-right: 5.7px;
        white-space: nowrap;
        background:#fff;
    }

这篇关于溢出x：滚动不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！