To continue on my previous post here are some more tweets with little Css tips that might help you in your projects.

Attribute selections

Check out the full documentation here: https://developer.mozilla.org/en-US/docs/Web/CSS/Attribute_selectors

Missing attribute selection

Text version is here: https://gist.github.com/vanaf1979/743529e1910c7f39eada070a41eba40c

Css :not() documentation: https://developer.mozilla.org/en-US/docs/Web/CSS/:not

To check for more a11y issues i recommend you check out checka11y.css https://github.com/jackdomleo7/Ch

Left aligning your html lists

Full text version is here: https://gist.github.com/vanaf1979/f1107b152e21560ac47a529ce733c808

Simple columns

Full text version is here: https://gist.github.com/vanaf1979/27ce8660def0de2c58a34c21e7ccf98c

Adding icons to your links

Full text version: https://gist.github.com/vanaf1979/1f73caabf97a70ee9629ef80052aa81b

Attribute selectors docs: https://developer.mozilla.org/en-US/docs/Web/CSS/Attribute_selectors

Font Awesome with pseudo-selectors docs: https://fontawesome.com/how-to-use/on-

Responsive headers with clamp

Live example in CodePen > https://codepen.io/Since1979/pen/KKgQzKw?editors=1100

Css Clamp Docs > https://developer.mozilla.org/en-US/docs/Web/CSS/clamp()

Css Clamp browser support > https://caniuse.com/?search=Clamp

Image reset

Want more of this?

If you would like to have these tips, and other stuff, in your twitter timeline come and follow me @Vanaf1979. If you just want the gist you can follow me on dev.to @Vanaf1979 or on as well Hashnode.

Thanks for reading and stay safe.

Share:

Leave a Reply