Firefox recommendation and personal understanding of CSS writing order _css/html

In recent work, encountered a lot of problems, one of the issues I think is the most important, that is the CSS writing order, he can reflect a front-end worker's thinking continuation. If you see this article, please do not think about which property to write.

Let's take a look at the recommended writing sequence for Firefox.
* mozilla.org Base Styles
* Maintained by Fantasai
* (classes defined in the Markup guide-http://mozilla.org/contribute/writing/markup)
*/
/* Suggested Order:
Display Properties
* Display
* List-style
* Position
* Float
* Clear
Self properties
* Width
* Height
* Margin
* Padding
* Border
* Background
Text properties
* Color
* Font
* Text-decoration
* Text-align
* Vertical-align
* White-space
* Other text
* Content
*
*/
From the above recommended order can be seen, very organized. The above recommended order does not write more detailed attributes, such as: Top,right,bottom,left, and so on, perhaps some people will ask, what impact on performance? I regret to tell you that I do not know, but I think, the orderly work is correct (perhaps you have a better way).

My understanding:
1. Display Properties: display| | visibility| | List-style (List-style-type, List-style-image, list-style-position) | | Overflow
2. Positioning and Floating properties: position| | top| | right| | bottom| | left| | float| | Clear
3. Box Model: width| | height| | margin| | Padding| | Border
4. Background: Background (background-image, background-position, Background-repeat, background-attachment)
5. Text Properties: font-style| | font-variant| | font-weight| | font-size| | font-family| | Color
6. Text Properties: text-indent| | text-align| | vertical-align| | Letter-spacing| | Word-spacing| | text-transform| | text-decoration| | Text-shadow
7. Other

Referring to someone's words, "Whether you use this order or not, I use it anyway." You are welcome to correct me

