I’ve placed a table in the center of a wordpress page and it’s inheriting traits that I’d rather it wouldn’t, namely it’s got a border and mouse-over effect. I’m trying to get it to actually be a transparent table with no border or mouse-over effect.
The HTML had everything in place that was needed, including hooks for styling. #post-8 is an id that—like any id or class—can be referenced for styling the element to which it applies or any child elements of that element. #post-8 was a handy hook for getting the job done, that’s all. Paul’s concern was that this id might change at some time, as it looks like an id inserted by a CMS that may not be there later on … but we are only guessing there.
Why could class or style not change the table, but id would?
There’s an important aspect of CSS called “specificity”. If there are two or more conflicting style rules on an element, there is a pecking order that determines which wins out. IDs carry more weight than classes, but there’s more to it than that. I didn’t check, but whatever other rules were applying to that table were too powerful to be overridden by a simple class on the table, but an ID had the extra weight to override them.
In general, it’s better to use existing hooks (e.g. #post-8) than to include new hooks every time you want to add new styling. It makes for more efficient and lean code. For example, if you have a <ul> menu in a <div class=“head”>, rather than give the <ul> a special class, just reference it with