How can I organize these CSS Selectors more efficiently? I want a CSS selector to apply to elements that have ids assigned as well

Question

Sorry for the poor wording on the title. I wanted to know if there was a way to have a CSS file do something like the following code, and have background color apply to all my table cells with ids. -

td {
background-color: #d3d3d3;
}

#OtherTableCell {
border: 1px solid black;
}

#AnotherTableCell {
font-weight: bold;
}

#OneMoreTableCell {
width: 5%;
}

Is there a way to do that, or do I just have to write it like

#OtherTableCell {
border: 1px solid black;
background-color: #d3d3d3;
}

#AnotherTableCell {
font-weight: bold;
background-color: #d3d3d3;
}

#OneMoreTableCell {
width: 5%;
background-color: #d3d3d3;
}

Answer 1

Google OOCSS (Object-oriented CSS) for guidelines on how to create "objects" in CSS to organize your CSS more efficiently. You simply need to follow DRY principles as well so styles aren't repeated unnecessarily.