CODEWITHSUNDEEP
css
sameold
sameold

Reputation: 19242

Any suggestions on improving this CSS?

I'm trying to find a better way to select this. Basically the <div> has an id of cat1 and it has <a> that has a class also cat1. Is there a better way to write this? I'm basically trying to select the <a> that has a similar class name as the div id it's within. 

div#cat1 a.cat1, 
div#cat2 a.cat2, 
div#cat3 a.cat3, 
div#cat4 a.cat4 { ... }

Upvotes: 0

Views: 74

Answers (2)

Rob
Rob

Reputation: 15160

You don't need the tag names.

#cat1 .cat1

Upvotes: 0

Mike Mertsock
Mike Mertsock

Reputation: 12015

Depending on the complexity of the rest of your CSS, you may be able to shorten your selectors, e.g. #cat1 .cat1, #cat2 .cat2, ... or just .cat1, .cat2, ...

But I would be interested to know why you have class names such as "cat1", "cat2", etc. Could you have a single class ("cat" for lack of a better word) that all of the anchor tags could share? This could be in addition to cat1, cat2, etc. So your markup would be like:

<div class="cat" id="cat1"><a class="cat cat1">...</a></div>
<div class="cat" id="cat2"><a class="cat cat2">...</a></div>

This way you could simplify your CSS selectors for properties that apply to all of these anchors:

div.cat a.cat { ... }

But still allow the use of specific selectors such as a.cat1 if you need to style some of these individually.

Upvotes: 1

Related Questions