Hacker News Reader

I'm obviously lacking in imagination here. How would using an ID for styling a "clearly one-per-page" element lead to problems? I'm thinking of things like the main page title, or some sort of primary navigation block. The whole point there is that I want the specific rules for those elements to override the defaults, right?

View on HN

It may be "clearly one-per-page" now, but it may not be. You don't really gain anything by using an ID. Keep the selector specificity simple so it doesn't bite you in the ass and cause a refactor.

.page-wrapper .page-main %article.main

There's no difference using that to

#page-wrapper #page-main %article#main

Psuedo example, those can be mix and matched with classes and IDS but doing so just complicates the selectors and the cascade.

There is of course exceptions and things that may just make total sense, but overall, it leads to complications. You don't gain any real benefits unless it's a JS hook for #id selector performance.

For example, styling the same unique block based on context. If it's a mainpage, I want it red, otherwise it's green.

Reply on news.ycombinator.com