3

I have several css classes I'd like to specify on an element. But I don't want to have to repeated place 3, 4 or more classes each time.

I'd like to go from

<span class ="class1 backgroundclass borderclass iconclass">Link</span>

To

<span class="linkClass">Link</span>

Can this be done? If so, how?

2 Answers 2

6

In normal CSS, you would have to include .linkClass into every class definition like this:

.class1, .linkClass { ...... }
.backgroundclass, .linkClass { ...... }
.borderclass, .linkClass { ...... }

Not very good for readability.

You could look into CSS pre-processors like LessCSS that make this easier. With LessCSS, it seems to be possible to do the following:

.linkClass {
  .class1;
  .backgroundclass;
  .borderclass;
}

LessCSS will then compile the final style sheet out of this.

Sign up to request clarification or add additional context in comments.

Comments

2

What you're asking doesn't really make a lot of sense I'm afraid. :-)

If you want to apply multiple generic CSS classes, simply add them one at a time. If however, you instead have a single CSS class with all of the required properties simply specify that.

Those are pretty much your options I'm afraid, with the choice between the two being whether there would be a significant amount of redundancy within the HTML rather than the CSS. (i.e.: If you're always using two of the generic classes then it makes sense to create a class with the combined properties in CSS.)

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.