Need help with my class

https://gyazo.com/d99dc1a032068c4d006dc902456c79d5

Let’s say I want to do 6 classes in html that im going to style to boxes in css. There must be a more good-looking way to do it than this but I can’t find an answer.

What are you trying to accomplish? Are all of the divs supposed to look the same? Will they each share some styles but also have unique styles?

If they should all look the same, just create a box class and put that on each div. If they will all share some styles and also have unique styles, you can put the shared styles in a box class, and then either do something like you currently have:

  <div class="box box-1"></div>
  <div class="box box-2"></div>
  <div class="box box-3"></div>
  <div class="box box-4"></div>
  <div class="box box-5"></div>
  <div class="box box-6"></div>

Where box-1, etc. gets their own unique styles.

Or you could give all elements the box class and handle unique element targeting in CSS using the :nth-child pseudo-class.

.box:nth-child(n) { /* n is the box number: 1, 2, 3, 4, 5, 6, etc. */
  /* styles */
}
2 Likes