CSS with only ids and classes - is this the right way? [closed]

It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that i开发者_Go百科t can be reopened, visit the help center. Closed 11 years ago.

I think I could write pretty much all my CSS styles just by using ids and classes. No complicated selectors. No complicated rules.

Besides, the following holds:

The sad truth about CSS3 selectors is that they really shouldn’t be used at all if you care about page performance. Decorating your markup with classes and ids and matching purely on those while avoiding all uses of sibling, descendant and child selectors will actually make a page perform significantly better in all browsers.

and I care ABOUT page performance...

SEE HERE FOR fURTHER INFO: http://www.stevesouders.com/blog/2009/03/10/performance-impact-of-css-selectors/

---

Oversimplification may mean worse maintainability

Sometimes setting it all in just classes and IDs isn't enough. Depends whether you also control your markup. If you do you can do that, but I suppose it will become a PITA when you'd want to change things. Finding your way around with IDs is significantly less verbose than descendant selectors.

#SomeButton { ... } // who the hell am I

vs.

.editor .action-button { ... } // oh that's who!

Don't use too strong restrictions = don't oversimplify things because they will get complicates on the long run (they'll turn against you). Trade some for the benefit of maintainability. It could as well mean that you would introduce lots of repeated styles. So be care full with simplification.

If backward compatibility is also an issue here, then restrict yourself to descendant selectors only and don't use too deep relationships if not needed.

---

It's the right way for speed and backward compatibility. These are important.

However, it's the wrong way for maintainability (someone else continuing your work) and scalability (many sites, subdomains, pages, widgets, sub-themes).

---

It depends on the situation. If you can create some generic style rules for certain elements, it can save you a lot of time and creating repetitive code. For instance if you write

.div-element-1{font-family:Helvetica; font-size:12px;}
.div-element-2{font-family:Helvetica; font-size:14px;}
.div-element-3{font-family:Helvetica; font-size:18px;}

instead you can write:

div{font-family:Helvetica;}

and that will get applied to all divs and keeping you from writing your font over and over and over