Update Readme

Readme.md

@@ -31,28 +31,30 @@ Include `destyle.css` in the `head` of your HTML file before your main styleshee
 
 ### Recommended
 
-Add your base font and color styles to the `body` element in your stylesheet, all other elements will inherit the style from the body.
+Add your base font and color styles to the `html` or `body` element in your stylesheet, all other elements will inherit the style from the body.
 
 ```css
 /* app.css */
 
-body {
+html {
   color: #333;
   font: 16px/1.4 "Helvetica Neue", sans-serif;
 }
 ```
 
+### Styling generated content
+
 It is discouraged to define styles for raw html tags apart from `body` and `html`, use classes (or any other selectors / system) for styling.
 
 If you need to create styles for tags generated by a CMS or markdown wrap them in a class (e.g. `.type`).
 
 ```css
 .type h1 {
-  \* styles *\
+  /* styles */
 }
 
 .type h2 {
-  \* styles *\
+  /* styles */
 }
 ```
 
@@ -160,14 +162,6 @@ destyle.css resets buttons completely to make them usable as any other element <
 </button>
 ```
 
-How to create the styles is up to the author, it can be by creating classes, compose style using functional classes, styling inside a react component, etc. In any case the author always gets a clean slate for styling each element and it is up to him/her to reuse the styles or start from scratch for every instance.
-
-## Why?
-
-[Eric Meyer's reset](https://meyerweb.com/eric/tools/css/reset/) resets properties on elements that do not need it, are unused or even deprecated, this creates bloat in the browser's style inspector which makes developing and debugging less efficient. [Normalize.css](https://github.com/necolas/normalize.css) makes elements look consistent across browsers and it does it well, but it does not remove the user agent's assumptions about how things look. Destyle.css targets both reseting & normalization.
-
-Compare the results [here](https://nicolas-cusan.github.io/destyle.css/compare.html).
-
 ## Changelog
 
 - **v3.0.0.** 2021-09-03
@@ -185,6 +179,12 @@ Compare the results [here](https://nicolas-cusan.github.io/destyle.css/compare.h
   - Fixed border color inheritance for `table` borders in Chrome
 - **v2.0.0.** 2020-10-15 - Add `border-style: solid` and `border-width: 0` to `*, ::before, ::after` selector. This change might affect how borders are used and therefor is considered a breaking change. The benefit is that simply adding a border-width to an element will display a border without the need to set the border-style explicitly.
 
+## Why?
+
+[Eric Meyer's reset](https://meyerweb.com/eric/tools/css/reset/) resets properties on elements that do not need it, are unused or even deprecated, this creates bloat in the browser's style inspector which makes developing and debugging less efficient. [Normalize.css](https://github.com/necolas/normalize.css) makes elements look consistent across browsers and it does it well, but it does not remove the user agent's assumptions about how things look. Destyle.css targets both reseting & normalization.
+
+Compare the results [here](https://nicolas-cusan.github.io/destyle.css/compare.html).
+
 ## Credits
 
 This project is heavily inspired by [normalize.css](https://github.com/necolas/normalize.css) and the original [reset](https://meyerweb.com/eric/tools/css/reset/) by Eric Meyer. The source of the test page is from [html5-test-page](https://github.com/cbracco/html5-test-page) with some additions.