两种不同列大小的问题

Question

我带这个网站是因为Wordpress.stackexchange.com说它不够具体......请帮忙！

我有一个网站here。

我正在尝试调整中心列的大小，我很难过。我曾经把一切都弄错了，但是客户进去并更新了一些内容并且更新了CSS，我在某处搞砸了。只是不确定在哪里。

这是侧边栏部分的CSS ...

/** Sidebar *********************************/ 
.side-wrap {
 width: 205px;
 position:relative;
 padding:0;
 padding-top:10px;
 margin-top:-10px;
 z-index:1;
}

.side-wrap.left.border.bottom {float:left;background:url(images/content-border-d.png) right bottom no-repeat;}


.sidebar-content {
 display:block;
 position:relative;
 height:auto;
 width: 205px;
 position:relative;
 padding:0;
 padding-top:10px;
 margin-top:-10px;
 z-index:1;
}


.sidebar-content ul li.sidebartitle a { background:none;}
.sidebar-content ul li.widget {clear:both;}
.sidebar-content ul li.widget:after { content: "."; display: none; clear: both; visibility: hidden; }
.side-wrap .border-wrap.left .sidebar-content ul .widget {padding-right:5px; width:335px; }
.side-wrap .border-wrap.right .sidebar-content ul .widget {padding-left:5px; width:200px; }
.sidebar-content ul .widget {padding-top:10px;padding-bottom:5px;}
.sidebar-content li {list-style:none;}

.border-wrap {
 width: 100%;
 position:relative;
 height:auto;
 z-index:0;
 height:100%;
 padding-bottom:25px;
}

然而，左侧边栏应该是335px，右侧边栏是200px，这是现在的位置。

Answer 1

左边div有这些类：

class="border-wrap right in-full border bottom"，

它应该是：

class="border-wrap left in-full border bottom"

因为这个选择器没有选择任何东西：

.side-wrap .border-wrap.left .sidebar-content ul .widget {
    padding-right:5px; 
    width:335px; 
}

Answer 2

我可以让你的左侧边栏宽度为280px，然后它将右侧边栏推到一个新的线上...这是截图 - 这是否接近原始布局？

Answer 3

针对内部容器进行了更新

在我看来，包含整个中间部分的div是：

<div class="side-wrap  left out-quarter  ">

我认为以下CSS条目应该可以解决问题：

div.side-wrap.left.out-quarter {width:335px;}
div.side-wrap.left.out-quarter .sidebar-content,
div.side-wrap.left.out-quarter .sidebar-content ul li {width:100%;}

将它放在CSS文件的底部。