我的侧边栏将我的整个网站推倒

Question

所以我得到了这个网站，所有内容都完美排列，页眉、正文页脚等。上周我尝试添加一个侧边栏，我意识到它把我的主要内容推到了下面。 很多问题是，我怎样才能使侧边栏的边距/高度独立于我的主要内容？ （下面贴出 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;
}

Answer 1

position: absolute;

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