Question

我正在撰写此页面：http://sydneypadua.com/2dgoggles/

我正在尝试重新定义content-sidebar-wrap的宽度，以便停止将左侧边栏向下推到页面底部。

在View Source中查看，您将看到我添加新样式的位置：

.double-sidebar #content-sidebar-wrap {
    width: 795px ! important;
}

但是，使用Chrome开发者工具检查应用于content-sidebar-wrap div的样式，您只会看到：

width: 780px;
    .double-sidebar #content-sidebar-wrap - 780px style.css:596
    [with strikethrough] #content-sidebar-wrap - 960px style.css:591

为什么我在页面的头部定义的样式不被选中？

Answer 1

我尝试validate the css of your page，这些错误出现在页面中：

32  .double-sidebar #content-sidebar-wrap   Lexical error at line 33, column 1.  
     Encountered: "\ufffd" (65533), after : "" � � width: 795px !important;
33  .double-sidebar #content-sidebar-wrap   Parse Error }
45   *  Parse Error */ #content .post 
    { padding-left: 5px ! important; padding-right: 5px ! important; }

可能你插入了一个无法识别的字符（由于复制和粘贴，可能？）导致解析器错误，所以尝试重写整个规则。

Answer 2

由于某种原因，样式标签不喜欢id删除它，它应该可以正常工作。

<style     type="text/css">    
//no id ^
//Other rules...

/* Fix for sidebar widths. */

.double-sidebar #content-sidebar-wrap {
    width: 795px !important;
}

//other rules...

</style>

Answer 3

这是我在浏览你的css http://sydneypadua.com/2dgoggles/时在FF中看到的：

.double-sidebar #content-sidebar-wrap {
}

我确定“！important”不应该有空格。

Answer 4

应该是

#content-sidebar-wrap {
    width: 795px !important;
}

不需要

。双边栏，因为＃content-sidebar-wrap 明确地确定了div。

Answer 5

尝试删除*/课程末尾的.double-sidebar #sidebar-1-wrap，因为这可能会破坏您的CSS，并重写css规则.double-sidebar #content-sidebar-wrap。

另外，提醒一下，如果你是样式id，你不需要在它们之前指定一个类，选择器是从右到左阅读所以只用id就足够了

未应用定义的CSS样式？

5 个答案: