What is better one common CSS class or 2 classes with different names and same code?

Question

I cant find answer of my question. So I'm wondering what is better if we talk for performance - to have one common class or to have two different class names that do same thing but improve the code readability.

.some_ul{
margin:0;
padding:0;
}

OR

    .people_ul, .animals_ul{
margin:0;
padding:0;
}

Is there something like in the object oriented programming, so when you make more classes or objects you use more resources or in CSS there is nothing like that and there is not a problem to make the second aproach which helps me to read my code easily.

initially it is fine to keep one common class i think. Name it appropriately so looking at it gives away a clue about what the class is for. If you then have to visually differentiate the two it makes more sense to create two separate classes. — Jerry Saravia, May 11 '13 at 17:40

score 3 · Accepted Answer · edited May 23 '17 at 12:21

3

The subject of css selector performance was a hot issue last year. Since there everyone has calmed down. Looking at the facts –- the statistics -- It's really a non-issue. Go for readability. The difference is so negligible. If you are really concerned about front-end performance you should focus your efforts else where.

Check out this link that talks about the subject in more depth: Assign a class name to <img> tag instead of write it in css file?

edited May 23 '17 at 12:21

Community

1
1

answered May 11 '13 at 16:38

Timidfriendly

3,224
4
27
36

Thanks for the explanation! I also think that the readability is most important, but I wasn't able to find articles for the performance side of the whole picture, but your answer tells enough :) – cyrat May 11 '13 at 18:37

score 1 · Answer 2 · answered May 11 '13 at 16:35

1

It depends on the definition of "the same thing".

If you have two elements that share common semantics, you should use one class for both. If you have two elements that have different semantics but just happen to share some visual properties, then use two separate classes.

Being consistent in this goes a long way in ensuring that maintaining and evolving your website will be straightforward instead of painful.

answered May 11 '13 at 16:35

Jon

428,835
81
738
806

I missed to tell that I get to this question because I was having two elements with different semantics, but with equal CSS properties and values. And thanks for the answer, I also think that giving proper names will boost the time to maintenance my website. – cyrat May 11 '13 at 18:40

score -2 · Answer 3 · answered May 11 '13 at 16:33

-2

css is stand for reducing the file size of website. It is good practice to use common class

answered May 11 '13 at 16:33

dsfg

130
9

What is better one common CSS class or 2 classes with different names and same code?

3 Answers3