Skip to content

Update README.md #166

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 1 commit into from
Closed
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
51 changes: 25 additions & 26 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,33 +18,32 @@ A collection of tips to help take your CSS skills pro.


## Protips

1. [Use a CSS Reset](#use-a-css-reset)
1. [Inherit `box-sizing`](#inherit-box-sizing)
1. [Use `unset` Instead of Resetting All Properties](#use-unset-instead-of-resetting-all-properties)
1. [Use `:not()` to Apply/Unapply Borders on Navigation](#use-not-to-applyunapply-borders-on-navigation)
1. [Check If Font Is Installed Locally](#check-if-font-is-installed-locally)
1. [Add `line-height` to `body`](#add-line-height-to-body)
1. [Set `:focus` for Form Elements](#set-focus-for-form-elements)
1. [Vertically-Center Anything](#vertically-center-anything)
1. [Comma-Separated Lists](#comma-separated-lists)
1. [Select Items Using Negative `nth-child`](#select-items-using-negative-nth-child)
1. [Use SVG for Icons](#use-svg-for-icons)
1. [Use the "Lobotomized Owl" Selector](#use-the-lobotomized-owl-selector)
1. [Use `max-height` for Pure CSS Sliders](#use-max-height-for-pure-css-sliders)
1. [Equal-Width Table Cells](#equal-width-table-cells)
1. [Get Rid of Margin Hacks With Flexbox](#get-rid-of-margin-hacks-with-flexbox)
1. [Use Attribute Selectors with Empty Links](#use-attribute-selectors-with-empty-links)
1. [Style "Default" Links](#style-default-links)
1. [Intrinsic Ratio Boxes](#intrinsic-ratio-boxes)
1. [Style Broken Images](#style-broken-images)
1. [Use `rem` for Global Sizing; Use `em` for Local Sizing](#use-rem-for-global-sizing-use-em-for-local-sizing)
1. [Hide Autoplay Videos That Aren't Muted](#hide-autoplay-videos-that-arent-muted)
1. [Use `:root` for Flexible Type](#use-root-for-flexible-type)
1. [Set `font-size` on Form Elements for a Better Mobile Experience](#set-font-size-on-form-elements-for-a-better-mobile-experience)
1. [Use Pointer Events to Control Mouse Events](#use-pointer-events-to-control-mouse-events)
1. [Set `display: none` on Line Breaks Used as Spacing](#set-display-none-on-line-breaks-used-as-spacing)
1. [Use `:empty` to Hide Empty HTML Elements](#use-empty-to-hide-empty-html-elements)
2. [Check If Font Is Installed Locally](#check-if-font-is-installed-locally)
3. [Comma-Separated Lists](#comma-separated-lists)
4. [Equal-Width Table Cells](#equal-width-table-cells)
5. [Get Rid of Margin Hacks With Flexbox](#get-rid-of-margin-hacks-with-flexbox)
6. [Hide Autoplay Videos That Aren't Muted](#hide-autoplay-videos-that-arent-muted)
7. [Inherit `box-sizing`](#inherit-box-sizing)
8. [Intrinsic Ratio Boxes](#intrinsic-ratio-boxes)
9. [Select Items Using Negative `nth-child`](#select-items-using-negative-nth-child)
10. [Set `display: none` on Line Breaks Used as Spacing](#set-display-none-on-line-breaks-used-as-spacing)
11. [Set `:focus` for Form Elements](#set-focus-for-form-elements)
12. [Set `font-size` on Form Elements for a Better Mobile Experience](#set-font-size-on-form-elements-for-a-better-mobile-experience)
13. [Style Broken Images](#style-broken-images)
14. [Style "Default" Links](#style-default-links)
15. [Use a CSS Reset](#use-a-css-reset)
16. [Use Attribute Selectors with Empty Links](#use-attribute-selectors-with-empty-links)
17. [Use `unset` Instead of Resetting All Properties](#use-unset-instead-of-resetting-all-properties)
18. [Use `:not()` to Apply/Unapply Borders on Navigation](#use-not-to-applyunapply-borders-on-navigation)
19. [Use SVG for Icons](#use-svg-for-icons)
20. [Use the "Lobotomized Owl" Selector](#use-the-lobotomized-owl-selector)
21. [Use `max-height` for Pure CSS Sliders](#use-max-height-for-pure-css-sliders)
23. [Use `rem` for Global Sizing; Use `em` for Local Sizing](#use-rem-for-global-sizing-use-em-for-local-sizing)
24. [Use `:root` for Flexible Type](#use-root-for-flexible-type)
25. [Use Pointer Events to Control Mouse Events](#use-pointer-events-to-control-mouse-events)
27. [Use `:empty` to Hide Empty HTML Elements](#use-empty-to-hide-empty-html-elements)
28. [Vertically-Center Anything](#vertically-center-anything)


### Use a CSS Reset
Expand Down