using the nth-of-type selector to target a class with the same name

using the nth-of-type css selector you can target a class with the same name, using a number.

I guess this can make your code a bit neater not having to add a sub class

HTML

<div class='my-class'>x</div>
<div class='my-class'>x</div>
<div class='my-class'>x</div>

CSS

.my-class {
	background:#000;
  	height:100px;
  	width:100px;
}
.my-class:nth-of-type(2) {
  background: #F00;
}
x
x
x

Other Items in css

No Items Found.

Add Comment
Type in a Nick Name here
 
Page Views

This page has been viewed 71 times.

Search Code
Search Code by entering your search text above.
Welcome

This is my test area for webdev. I keep a collection of code snippits here, mostly for my reference. Also if i find a good site, i usually add it here.

âĪðŸ‘Đ‍ðŸ’ŧðŸ•đ

Random Quote
For a long time it had seemed to me that life was about to begin - real life. But there was always some obstacle in the way, something to be gotten through first, some unfinished business, time still to be served, or a debt to be paid. Then life would begin. At last it dawned on me that these obstacles were my life.
Alfred D. Souza