元素溢出隐藏滚动

1. flex + overflow

//css
        .class-column {
            display: flex;
            overflow-x: scroll;
        }
        .class-column a {
            flex: none;
            width: 50vw;
            height: 300px;
            background: #ccc;
            margin-right: 10px;
        }
//html
    <nav class="class-column">
        <a href=""></a>
        <a href=""></a>
        <a href=""></a>
        <a href=""></a>
    </nav>

2. white-space + inline-block

// css
        .class-column {
            overflow-x: scroll;
            white-space: nowrap;
        }
        .class-column a {
            display: inline-block;
            width: 50vw;
            height: 300px;
            background: #ccc;
            margin-right: 10px;
        }
// html
    <nav class="class-column">
        <a href=""></a>
        <a href=""></a>
        <a href=""></a>
        <a href=""></a>
    </nav>