-1

仅使用 CSS，我需要使黑框（链接）排成一行，并且当链接行比它长时，容器（暂时命名为 div.hurrdurr）有一个水平滚动条。我也不希望在滚动时有任何剩余空间。链接将动态更改，因此据我所知，我不能使用设置的宽度。

我只需要它在最新的 Firefox 中工作，因为这是我用来显示页面的唯一东西。

这就是我所拥有的：

<!DOCTYPE html>
<html style="width: 1000px;">
    <head>
        <title>Hurrr</title>
        <style>
            div.contain {
                background-color: #999999;
                height: 90px;
                width: 100%;
            }
            div.hurrdurr {
                background-color: #CCCCCC;
                white-space: nowrap;
                width: 100%;
                overflow: auto;
            }
            div.hurrdurr a {
                width: 60px;
                height: 20px;
                margin-right: 8px;
                margin-top: 4px;
                background-color: #333333;
                color: #CCCCCC;
                text-align: center;

                float: left;
                display: inline-block;
            }
        </style>
    </head>
    <body>
        <div class="contain">
            <div class="hurrdurr">
                <a class="durr">1/25</a>
                <a class="durr">2/25</a>
                <a class="durr">3/25</a>
                <a class="durr">4/25</a>
                <a class="durr">5/25</a>
                <a class="durr">6/25</a>
                <a class="durr">7/25</a>
                <a class="durr">8/25</a>
                <a class="durr">9/25</a>
                <a class="durr">10/25</a>
                <a class="durr">11/25</a>
                <a class="durr">12/25</a>
                <a class="durr">13/25</a>
                <a class="durr">14/25</a>
                <a class="durr">15/25</a>
                <a class="durr">16/25</a>
                <a class="durr">17/25</a>
                <a class="durr">18/25</a>
                <a class="durr">19/25</a>
                <a class="durr">20/25</a>
                <a class="durr">21/25</a>
                <a class="durr">22/25</a>
                <a class="durr">23/25</a>
                <a class="durr">24/25</a>
                <a class="durr">25/25</a>
            </div>
        </div>
    </body>
</html>
4

1 回答 1

0

float:left从你的删除你的div.hurrdurr a，这应该给你滚动。

于 2012-11-23T02:57:31.340 回答