CSS zebra-striping in sets of three and four

CSS

Here is a simplest way to create zebra styled elements in sets of three using CSS only. DEMO See the Pen CSS zebra-striping in sets of three by Puneet Sharma (@webdevpuneet) on CodePen. Effective CSS .zebraStrip > div:nth-child(6n+1), .zebraStrip >...

Responsive Square, Circle with CSS only

CSS

Here is a simple technique to create responsive shapes like a square, circle or rectangle (maintaining it’s aspect ratio) with the help of CSS only. DEMO See the Pen Responsive Square with CSS by Puneet Sharma (@webdevpuneet) on CodePen. HTML <div...

Simple CSS blinking cursor

CSS

Here is an example of simple CSS only blinking cursor that you can use and modify according to your needs. I have used keyframes to introduce infinite blinking animation to the cursor. See the Pen Simple CSS Blinking Cursor by Puneet Sharma (@webdevpuneet) on...

ReactJS CSS Grid Builder

React

Add images of various formats via the buttons in the demo below See the Pen ReactJS CSS Grid Builder – Auto Flow Demo by Puneet Sharma (@webdevpuneet) on CodePen.

jQuery Search text inside div to any level and add a class to parent element.

jQuery

I hope this code will help you get to what you need or atleast take you near to it. I created it to search text inside cards where user writes some text in input tag and the results is displayed by hiding all those who does not have that string. This script can...