1. Image carousel in 2 lines of CSS

.container {
    scroll-snap-type: x mandatory;
}

.slides {
    scroll-snap-align: start;
}

See this is action here👇

2. Truncate text without using JavaScript😎

.example {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

3. Negative value in "nth-child"

Use negative value in nth-child and select element form 1 to n. For example, code snippet will select 1 to 4 "li" element

li:nth-child() {
    color: red
}

Note: I will add a cool tip or trick daily to this article