9 CSS Tricks for you to create 66.6% more elegant styles! πππ
π Follow Thread π§΅
π Follow Thread π§΅
1. Use inset property instead of using top, bottom, left, right. It is a really convenient shortcut! π 
2. Easily add commas for each item in the list with :not(:last-child)::after! π
3. Easily change text selection color with ::selection!
4. Use aspect-ratio for adjusting the ratio of elements automatically.
So you can add only width or height and CSS will calculate the ratio internally!
So you can add only width or height and CSS will calculate the ratio internally!
5. Use clamp() allows you to set a font-size, width, height, border, etc that grows with the size of the viewport, but doesn't go below a minimum value or above a maximum!
6. Use background-blend-mode with background-image property for creating an amazing mix of colors and images!
7. Use :first-letter to be able to style only the first letter in a paragraph!
Book-style with only one property!
Book-style with only one property!
8. The ::selection allows you to change styles for selected text on your website!
9. By using mask-image with background-image you can add very interesting shapes for your pictures with ease!
That's all folks! π₯π§―
If you found this thread useful, please consider following @eugZolotarenko and retweeting the first tweet. π’
If you found this thread useful, please consider following @eugZolotarenko and retweeting the first tweet. π’
Extra one!
Text containers not always need to be rectangular!
Just use shape-outside for your image to create different unusual shapes for texts!
Text containers not always need to be rectangular!
Just use shape-outside for your image to create different unusual shapes for texts!
Go to the Top of the Tweet π
https://twitter.com/eugZolotarenko/status/1463486572062560257
β’ β’ β’
Missing some Tweet in this thread? You can try to
force a refresh
γ
