Add: example of ordering properties by type

Author: hello@cyan.red

css_architecture.md

@@ -442,6 +442,43 @@ Ultimately, you have to find a pattern that works for you and your team. The str
 /* STATE */
 ```
 
+Beyond that, you could also select a pattern for organizing the actual properties within the selectors. Though many people don't bother with this at all, some teams find it easier to order them alphabetically. Others prefer grouping properties by "type", for example:
+
+```css
+.selector {
+  /* positioning */
+  position: absolute;
+  z-index: 10;
+  top: 0;
+  right: 0;
+
+  /* display & box model */
+  display: inline-block;
+  overflow: hidden;
+  box-sizing: border-box;
+  width: 100px;
+  height: 100px;
+  padding: 10px;
+  border: 10px solid #333;
+  margin: 10px;
+
+  /* color */
+  background: #000;
+  color: #fff
+
+  /* text */
+  font-family: sans-serif;
+  font-size: 16px;
+  line-height: 1.4;
+  text-align: right;
+
+  /* other */
+  cursor: pointer;
+}
+```
+
+Given the recommendation to try to separate visual css from positioning css, I would probably lean towards alphabetical or random myself.
+
 
 ## Naming