Question

我找不到一种方法来将一些div放在彼此旁边（右边），这样就有一个水平滚动条而不是一个垂直滚动条）...有人提示吗？ http://jsfiddle.net/WRT6E/2/

<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <style type="text/css">
            html,body{
                height: 100%;
                width:100%;
            }
            .static{
                position:fixed;
                top:30%;
                width:20%;
                left:10%;
                height:20%;
                overflow:scroll;
                float:right;
                display:inline;
            }
           .static div{
                float:right;
                display:inline;
            }
        </style>
    </head>
    <body>
    </body>
    <div class="static">

        <div>
            <h1>Test Headline</h1>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
        </div>

                <div><h1>Test Headline2</h1>
                    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
        </div>
    </div>


</html>

Answer 1

JSFiddle

做你想做的事情，我已经使用另一个内部DIV来增长并保持2个浮动右DIV，并设置一个javascript来调整2个div的大小，使高度小于持有DIVs的高度。

如果你甚至添加了边距，边框或填充，代码将需要修改以考虑这些。

<强>更新

更新了小提琴，我忘了把卷轴考虑在内，现在做了粗略的高度缩小，并改变了将DIV的溢出保持为自动以移除垂直卷轴

在固定的父div元素内将多个div元素在右侧定位

1 个答案: