Question

我有这个：

我希望它只能水平滚动...我该怎么做？

HTML 的

<div id="boxchap">
    <h3>Chap~</h3>
    <div id="center">
        <div id="fulllist">
        <div id="boxchap" class="listchap">
            <a href="#">Mujaki no Rakuen – Chap 17</a>
        </div>
            <div id="boxchap" class="listchap">
            <a href="#">Mujaki no Rakuen – Chap 16</a>
        </div>
            <div id="boxchap" class="listchap">
            <a href="#">Mujaki no Rakuen – Chap 15</a>
        </div>
            <div id="boxchap" class="listchap">
            <a href="#">Mujaki no Rakuen – Chap 14</a>
        </div>
            <div id="boxchap" class="listchap">
            <a href="#">Mujaki no Rakuen – Chap 13</a>
        </div>
            <div id="boxchap" class="listchap">
            <a href="#">Mujaki no Rakuen – Chap 12</a>
        </div>
            <div id="boxchap" class="listchap">
            <a href="#">Mujaki no Rakuen – Chap 11</a>
        </div>
            <div id="boxchap" class="listchap">
            <a href="#">Mujaki no Rakuen – Chap 10</a>
        </div>
            <div id="boxchap" class="listchap">
            <a href="#">Mujaki no Rakuen – Chap 9</a>
        </div>
            <div id="boxchap" class="listchap">
            <a href="#">Mujaki no Rakuen – Chap 8</a>
        </div>
            <div id="boxchap" class="listchap">
            <a href="#">Mujaki no Rakuen – Chap 7</a>
        </div>
            <div id="boxchap" class="listchap">
            <a href="#">Mujaki no Rakuen – Chap 6</a>
        </div>
            <div id="boxchap" class="listchap">
            <a href="#">Mujaki no Rakuen – Chap 5</a>
        </div>
            <div id="boxchap" class="listchap">
            <a href="#">Mujaki no Rakuen – Chap 4</a>
        </div>
            <div id="boxchap" class="listchap">
            <a href="#">Mujaki no Rakuen – Chap 3</a>
        </div>
            <div id="boxchap" class="listchap">
            <a href="#">Mujaki no Rakuen – Chap 2</a>
        </div>
            <div id="boxchap" class="listchap">
            <a href="#">Mujaki no Rakuen – Chap 1</a>
        </div
            </div>
    </div>
</div>

CSS

#boxchap {margin-bottom : 140px;}
#boxchap .listchap {width : 230px;margin:0px 1px 0px 0px ;padding: 3px;float: left;border: 1px solid #A8A8A8;}
#center {margin-left:auto; margin-right:auto;width: 100%;padding-left: 3%;}
#fulllist {min-width:100%; height:140px;}

Answer 1

将以下代码添加到您的css-class：#boxchap

overflow: auto;
overflow-y: hidden;

现在它应该可以水平滚动。

您可能还需要为IE8添加：

-ms-overflow-y: hidden;

Answer 2

将以下代码添加到您的css-class：#boxchap

overflow: auto;
overflow-x: hidden;

如何才能使div水平滚动？

2 个答案: