css - 两种不同列大小的问题

Question

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

我在这里有一个网站。

我正在尝试调整中心列的大小，但我遇到了困难。我曾经一切都正确，但是一个客户进去更新了一些东西，更新了 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;
}

但是，左侧边栏应该是 335 像素，右侧边栏应该是 200 像素，这就是现在的位置。

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

Updated for inner containers

It looks to me like the div that contains the entire middle section is:

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

I think the following CSS entry should do the trick:

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%;}

Put it at the bottom of your CSS file.

Answer 3

我可以将您的左侧边栏设置为 280 像素的宽度，然后将右侧边栏推到一个新行...这是一个屏幕截图 - 这是您原始布局附近的任何地方吗？