2

所以我得到了这个网站,所有内容都排列得很完美,页眉、正文页脚等。上周我尝试添加一个侧边栏,我意识到它把我的主要内容压低了。很多问题是,我怎样才能使侧边栏的边距/高度独立于我的主要内容?(下面贴出CSS代码)

演示:编辑: http: //oldtimesdaily.tumblr.com/ 我的 tumblr 代码。现在的样子。绝对位置有效,主要内容回到顶部。但是现在我侧边栏的所有内容都卡在一起了,我猜绝对定位会删除所有边距?我应该用什么来代替侧边栏上的不同内容?

#quote { /*style for quote division*/
    position:relative;
    width:375px;
    height:70px;
    border:1px solid black;
    font-family:sans-serif;
    font-size:95%;
    padding:3px;
    background-color:lightyellow;
}
#auth { /*style for quote author, if any*/
    position:absolute;
    bottom:3px;
    right:10px;
}
#sidebar {           /*editable*/
    background: url('http://s10.postimg.org/uag5u79d1/vline.png') repeat-y left center;
    background-color: white;
    width: 260px;
    position: relative;
    top: 700px;
    left: 55%;
}
#sidebar .sTitle {
    padding: 0 0 10px 0;
    position: relative;
    margin: 0px 20px 0px;
    color: #222;
    font-size: 15px;
    line-height: 1;
    font-family: QuicksandBold, Helvetica, Arial, sans-serif;
    font-weight: bold;
    letter-spacing: 3px;
    text-decoration: none;
    border-bottom: 0px;
}
#sidebar .Categories {
    font-size: 11px;
    text-align: center;
    padding: 3px 5px;
    margin: 50px;
}
4

1 回答 1

5

position: absolute;

将使侧边栏独立于页面的其余部分

于 2013-06-24T15:05:41.610 回答