NuDreamer Posted April 24, 2017 Share Posted April 24, 2017 Hi Guys, Let me explain a little more what I'm trying to do. My products in the category listing are currently surrounded by a light grey border. I want to be able to highlight the first product in each listing with maybe a blue/green border, and a ribbon that says BestSeller. Basically.. I just need a function that says.. if this is the first product shown in the category listing.. add this CSS class. Would anyone have any idea how I can go about doing this? Thanks in advance. I'll of course share the finished code with the community. Link to comment Share on other sites More sharing options...
ArtcoInc Posted April 24, 2017 Share Posted April 24, 2017 @@NuDreamer Maybe this could work ... https://www.w3schools.com/cssref/sel_nth-child.asp Malcolm Link to comment Share on other sites More sharing options...
burt Posted April 24, 2017 Share Posted April 24, 2017 I think @@ArtcoInc is on the right track there. Try something like (note that this is off the top of my head and is not tested); .item:first-child .productHolder { background: #F3FAB6; border: 1px solid #575757; } Link to comment Share on other sites More sharing options...
ArtcoInc Posted April 24, 2017 Share Posted April 24, 2017 @@burt I remember, just over two years ago, you telling me about nth-child() in a chat session ... (that, and I took notes <g>) Malcolm Link to comment Share on other sites More sharing options...
burt Posted April 25, 2017 Share Posted April 25, 2017 Crumbs I don't recall that! Nice one Malcolm. I don't go in the Chat much anymore :( Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.