0

我有这个完美编码的布局:http: //jsfiddle.net/4Xbc8/

这正是我想要的,但是如果我在divs 中添加任何单词,它们都会不合适。

我有点理解divs 是如何工作的,但我不知道为什么divs 中的内容不合适。

知道为什么吗?

body
{
    background-color: blue;

    width: auto;
    overflow: auto;

    white-space:nowrap;

}

#mainwindow
{
    margin-top: 15px;
    max-height: 600px;
    background-color:black;
    height: 600px;
    width: 3000px;
    padding: 5px 5px 5px 5px;


}
#search_tile
{
    background-color: yellow;
    height: 50px;
    width: 350px;
    display: inline-block;
}
#timeline_tile
{
    margin: 5px;
    position:relative;
    width: 250px;

    height: 580px;
    background-color: white;
    display: inline-block;

}
#conversations_tile
{
    top: -210px;


    position:relative;
    width: 250px;
    height: 375px;
    background-color: gray;
    display: inline-block;
}
#source_tile
{
    background-color: yellow;
    width: 450px;
    height: 200px;
    display: inline-block;
    position:relative;
    left: -255px;
}



<div id="mainwindow">                   <!-- main window wrapper -->

    <div id="leftarea" class="leftarea">     <!-- LEFT AREA -->


        <div id="timeline_tile" class="timeline_tile"><div></div></div>
        <div id="conversations_tile" class="conversations_tile"></div>
        <div id="source_tile" class="source_tile"></div>

    </div>
4

1 回答 1

2

vertical-align: top;你的 div 低于你不希望低于的地方。对于你的“source_tile”给vertical-align: bottom;

在这里看到你的小提琴

于 2013-06-16T05:58:41.793 回答