编辑边栏CSS

时间:2014-12-05 21:00:26

标签: html css

我希望侧边栏占据整个容器,我会告诉你我正在寻找的东西。

here

This is the website.

这里有侧边栏的CSS代码

/* sidebar */

.sidebar {
background-color:#fff;
padding:13px; 
margin: 20px;
margin-bottom:30px;
padding-bottom:20px;
color:#000;
}

.sidebartitle {
background-color:#000;
margin-left: -13px;
margin-right: -13px;
margin-top: -16px;
padding: 20px;
padding-bottom: 20px;
margin-bottom:20px;
font-family: 'Raleway', sans-serif;
text-transform:uppercase;
font-size:22px;
text-align:left;
color:#fff;
}

#sidebar {
    position: relative;
    float: left;
        margin-left:15px;
    width: 340px;
        margin-top:20px;
}

在这里你有帖子的代码

#contentmiddle {
    margin-left: 370px;
    padding: 20px 0px 0px 0px;
        width:650px;  
}

    .post {
padding:40px;
margin-top:60px;
background-color:#fff;
background-color:#fff;
background-repeat: no-repeat;
padding-top:0;
padding-bottom:0;
    }

这是容器

/* content */
#content {
    padding: 0px 20px 0px 20px;
}

#principal {  
width:940px;  
margin:0 auto;  
min-height:100%;  
height:100%;  
margin-top:60px;
}  

2 个答案:

答案 0 :(得分:0)

尝试width:100%;。这将使内容填满它的容器。

注意:

不适用于position:fixed;

答案 1 :(得分:0)

首先我会改变更多,但只是修改你目前拥有的空间来填补空间,你会做出这些改变:

.sidebar的保证金为:margin: 23px 0;并填充至padding: 13px 0;

.sidebartitlemargin: -16px 0 13px;的边距

删除#content的填充

#contentmiddle的宽度为width: 715px;

.post摆脱填充

#contentmiddle h1#postyapa删除margin-leftmargin-right

然后看起来像这样:

enter image description here