Posted by acetrebo on November 3, 2011 at 3:06am
Need some help.....
I made a view duplicating the front page. I changed the display to a table, to make the news page look better. But, the table has the system grey background.
So, I added chages to the css in the zen views-style.css to overide it. The problem is, that the zen css is applied ( i can see it in firebug), but then further down the system css is applied, so my table is still grey.
How do I get past this?
If I look at
table class="views-table cols-3
i see my changes in the css:
Unfortunately, further down, in
tr class="odd views-row-first"
i see the table properties from system.css, which overrides my changes.
How do I make this work, besides editing the core css file?
Comments
Increase specificity
I think you need to increase the specificity of your CSS declaration so that your styling overrides the core styling. Perhaps add the region ID before the element in your zen CSS file, for example.
Im not sure what you mean. My
Im not sure what you mean.
My css is being applied. I can see it. But for whatever reason, the very last css applied, is the system. Right before the actual content, the td and tr elements are getting the css from the system css file.
For now, I just edited the sytem.css to remove the background color. eveything else I have tried applies the css before the system css, so not sure how to get around it.
I may have misunderstood the
I may have misunderstood the question, so see if this is relevant. When I use Safari's "Inspect Element" (similar to Firebug), I see some CSS styles are overridden (crossed out) by others. So, for example, html-reset.css sets the font size:
#skip-to-nav, #page {
font-size: 0.75em;
}
But pages.css also tried to set the font size, but it is crossed out.
body {
font-size: 0.95em;
}
I'm not a CSS guru, but as I understand it, the first CSS declaration is more specific since it identifies a specific object id (#page) so it overrides the more general CSS in the body style. I assume that, to override the system.css styles, you have to place similarly specific CSS in your zen style files. If it's the background, there is a page-backgrounds.css file that is used for that purpose.
Its the td background color I
Its the td background color I am trying to change.
I put my css in zens views-styles.css, and I can see it in firebug for the table I want to change.
But as I drop down to the last element, the td where that actual content resides, in firebug, I can see the system.css overriding my background color with the color specified in the system css file. It show td.active and the css from the system file, so it overrides my declarations.
So, it applies the system.css at the very last. So I have gone into that, and changed the background color for td.active to none, and that works, but Id rather not edit the system files if possible.