2

嗨，我试图将 2DIV并排放置

+--------------------------------+ +--------------------------------+
|                                | |                                |
|                                | |                                |
|            400px               | |            355px               |
|                                | |                                |
|                                | |                                |
|                                | |                                |
+--------------------------------+ +--------------------------------+

.header{
    background-image: url('../img/button-bg.png');
    padding: 0px;
    background-repeat: repeat-x;
    height: 36px;
}



.div1
{
    width: 400px;
    float: left;
    margin-right: 10px;
}


.div2
{

    width:355px;
}

我需要两者都DIV能够清除标题，所以我不能使用绝对位置

我尝试了 float left 属性，但是当页面太小时，另一个 div 将位于第一个 div 之下。我想知道是否可以这样做。

编辑：当屏幕太小时，我希望出现水平条

4

3 回答 3

4

是的，有可能：

<div class="outer">
    <div></div>
    <div></div>
</div>

.outer {
    overflow: hidden;
}
.outer div {
    float: left;
    width: 50%;
    height: 100px;
}
于 2013-02-05T20:01:22.967 回答
3

您可以display:inline-block;在 div 及white-space: nowrap;其父级上使用。

.header div{
    display:inline-block;
    vertical-align:top;
}
.header{
    white-space: nowrap;
    background-image: url('../img/button-bg.png');
    padding: 0px;
    background-repeat: repeat-x;
    height: 36px;
}
.div1{
    width: 400px;
    margin-right: 10px;
}    
.div2{
    width:355px;
}

http://jsfiddle.net/mowglisanu/a6YNY/

于 2013-02-05T20:34:50.007 回答
-2

如果您不希望您的元素浮动，您应该使用一个表格（或两个并排的跨度）。首先，了解什么是内联元素和块元素。div 是块元素，span 是内联元素。div 是用作块元素。它旨在充当块元素。除非您另有说明，否则它应该具有全宽。span 是一个内联元素，它允许其他元素紧挨着它自己。您可以搜索“内联与块 html”以获取更多信息

要查看滚动条，请将这些元素的容器的溢出 css 属性设置为滚动。 http://www.w3schools.com/cssref/pr_pos_overflow.asp

于 2013-02-05T20:06:29.280 回答