Merge branch 'master' of https://github.com/kungsgeten/emmet-mode

5 files changed, 382 insertions, 89 deletions

diff --git a/README.md b/README.md
index 6921735..b5dab90 100644
--- a/README.md
+++ b/README.md
@@ -561,3 +561,14 @@ Traverse between important code points in HTML.
 - `<C-M-right>` is "Next Edit Point" (`M-x emmet-next-edit-point`)
 
 For further information and demo see [Emmet's documentation](http://docs.emmet.io/actions/go-to-edit-point/).
+
+## Development Notes
+
+When working on emmet-mode, DO NOT directly edit `emmet-mode.el`.  It is generated from the files in the `/src` directory by `make`.  When making changes, make them to the relevant source file, then run:
+
+```sh
+make clean
+make
+```
+
+in the root directory of your emmet-mode repository.
diff --git a/conf/snippets.json b/conf/snippets.json
index 94228b1..12208c0 100644
--- a/conf/snippets.json
+++ b/conf/snippets.json
@@ -1,6 +1,5 @@
 {
   "css": {
-
     "snippets": {
       "@i": "@import url(|);",
       "@import": "@import url(|);",
@@ -8,37 +7,27 @@
       "@media": "@media ${1:screen} {\n\t|\n}",
       "@f": "@font-face {\n\tfont-family:|;\n\tsrc:url(|);\n}",
       "@f+": "@font-face {\n\tfont-family: '${1:FontName}';\n\tsrc: url('${2:FileName}.eot');\n\tsrc: url('${2:FileName}.eot?#iefix') format('embedded-opentype'),\n\t\t url('${2:FileName}.woff') format('woff'),\n\t\t url('${2:FileName}.ttf') format('truetype'),\n\t\t url('${2:FileName}.svg#${1:FontName}') format('svg');\n\tfont-style: ${3:normal};\n\tfont-weight: ${4:normal};\n}",
-
       "@kf": "@-webkit-keyframes ${1:identifier} {\n\t${2:from} { ${3} }${6}\n\t${4:to} { ${5} }\n}\n@-o-keyframes ${1:identifier} {\n\t${2:from} { ${3} }${6}\n\t${4:to} { ${5} }\n}\n@-moz-keyframes ${1:identifier} {\n\t${2:from} { ${3} }${6}\n\t${4:to} { ${5} }\n}\n@keyframes ${1:identifier} {\n\t${2:from} { ${3} }${6}\n\t${4:to} { ${5} }\n}",
-
-
       "anim": "animation:|;",
       "anim-": "animation:${1:name} ${2:duration} ${3:timing-function} ${4:delay} ${5:iteration-count} ${6:direction} ${7:fill-mode};",
       "animdel": "animation-delay:${1:time};",
-
       "animdir": "animation-direction:${1:normal};",
       "animdir:n": "animation-direction:normal;",
       "animdir:r": "animation-direction:reverse;",
       "animdir:a": "animation-direction:alternate;",
       "animdir:ar": "animation-direction:alternate-reverse;",
-
       "animdur": "animation-duration:${1:0}s;",
-
       "animfm": "animation-fill-mode:${1:both};",
       "animfm:f": "animation-fill-mode:forwards;",
       "animfm:b": "animation-fill-mode:backwards;",
       "animfm:bt": "animation-fill-mode:both;",
       "animfm:bh": "animation-fill-mode:both;",
-
       "animic": "animation-iteration-count:${1:1};",
       "animic:i": "animation-iteration-count:infinite;",
-
       "animn": "animation-name:${1:none};",
-
       "animps": "animation-play-state:${1:running};",
       "animps:p": "animation-play-state:paused;",
       "animps:r": "animation-play-state:running;",
-
       "animtf": "animation-timing-function:${1:linear};",
       "animtf:e": "animation-timing-function:ease;",
       "animtf:ei": "animation-timing-function:ease-in;",
@@ -46,9 +35,7 @@
       "animtf:eio": "animation-timing-function:ease-in-out;",
       "animtf:l": "animation-timing-function:linear;",
       "animtf:cb": "animation-timing-function:cubic-bezier(${1:0.1}, ${2:0.7}, ${3:1.0}, ${3:0.1});",
-
-      "ap": "appearance:${1:none};",
-
+      "ap": "appearance:${none};",
       "!": "!important",
       "pos": "position:${1:relative};",
       "pos:s": "position:static;",
@@ -74,7 +61,6 @@
       "cl:l": "clear:left;",
       "cl:r": "clear:right;",
       "cl:b": "clear:both;",
-
       "colm": "columns:|;",
       "colmc": "column-count:|;",
       "colmf": "column-fill:|;",
@@ -85,12 +71,14 @@
       "colmrw": "column-rule-width:|;",
       "colms": "column-span:|;",
       "colmw": "column-width:|;",
-
       "d": "display:${1:block};",
       "d:n": "display:none;",
       "d:b": "display:block;",
+      "d:f": "display:flex;",
+      "d:if": "display:inline-flex;",
       "d:i": "display:inline;",
       "d:ib": "display:inline-block;",
+      "d:ib+": "display: inline-block;\n*display: inline;\n*zoom: 1;",
       "d:li": "display:list-item;",
       "d:ri": "display:run-in;",
       "d:cp": "display:compact;",
@@ -180,9 +168,24 @@
       "ol:n": "outline:none;",
       "olo": "outline-offset:|;",
       "olw": "outline-width:|;",
+      "olw:tn": "outline-width:thin;",
+      "olw:m": "outline-width:medium;",
+      "olw:tc": "outline-width:thick;",
       "ols": "outline-style:|;",
-      "olc": "outline-color:${1:#000};",
+      "ols:n": "outline-style:none;",
+      "ols:dt": "outline-style:dotted;",
+      "ols:ds": "outline-style:dashed;",
+      "ols:s": "outline-style:solid;",
+      "ols:db": "outline-style:double;",
+      "ols:g": "outline-style:groove;",
+      "ols:r": "outline-style:ridge;",
+      "ols:i": "outline-style:inset;",
+      "ols:o": "outline-style:outset;",
+      "olc": "outline-color:#${1:000};",
       "olc:i": "outline-color:invert;",
+      "bfv": "backface-visibility:|;",
+      "bfv:h": "backface-visibility:hidden;",
+      "bfv:v": "backface-visibility:visible;",
       "bd": "border:|;",
       "bd+": "border:${1:1px} ${2:solid} ${3:#000};",
       "bd:n": "border:none;",
@@ -191,7 +194,7 @@
       "bdcl": "border-collapse:|;",
       "bdcl:c": "border-collapse:collapse;",
       "bdcl:s": "border-collapse:separate;",
-      "bdc": "border-color:${1:#000};",
+      "bdc": "border-color:#${1:000};",
       "bdc:t": "border-color:transparent;",
       "bdi": "border-image:url(|);",
       "bdi:n": "border-image:none;",
@@ -254,7 +257,7 @@
       "bdt:n": "border-top:none;",
       "bdts": "border-top-style:|;",
       "bdts:n": "border-top-style:none;",
-      "bdtc": "border-top-color:${1:#000};",
+      "bdtc": "border-top-color:#${1:000};",
       "bdtc:t": "border-top-color:transparent;",
       "bdr": "border-right:|;",
       "br": "border-right:|;",
@@ -262,7 +265,7 @@
       "bdr:n": "border-right:none;",
       "bdrst": "border-right-style:|;",
       "bdrst:n": "border-right-style:none;",
-      "bdrc": "border-right-color:${1:#000};",
+      "bdrc": "border-right-color:#${1:000};",
       "bdrc:t": "border-right-color:transparent;",
       "bdb": "border-bottom:|;",
       "bb": "border-bottom:|;",
@@ -270,7 +273,7 @@
       "bdb:n": "border-bottom:none;",
       "bdbs": "border-bottom-style:|;",
       "bdbs:n": "border-bottom-style:none;",
-      "bdbc": "border-bottom-color:${1:#000};",
+      "bdbc": "border-bottom-color:#${1:000};",
       "bdbc:t": "border-bottom-color:transparent;",
       "bdl": "border-left:|;",
       "bl": "border-left:|;",
@@ -278,18 +281,18 @@
       "bdl:n": "border-left:none;",
       "bdls": "border-left-style:|;",
       "bdls:n": "border-left-style:none;",
-      "bdlc": "border-left-color:${1:#000};",
+      "bdlc": "border-left-color:#${1:000};",
       "bdlc:t": "border-left-color:transparent;",
       "bdrs": "border-radius:|;",
       "bdtrrs": "border-top-right-radius:|;",
       "bdtlrs": "border-top-left-radius:|;",
       "bdbrrs": "border-bottom-right-radius:|;",
       "bdblrs": "border-bottom-left-radius:|;",
-      "bg": "background:|;",
+      "bg": "background:#${1:000};",
       "bg+": "background:${1:#fff} url(${2}) ${3:0} ${4:0} ${5:no-repeat};",
       "bg:n": "background:none;",
       "bg:ie": "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='${1:x}.png',sizingMethod='${2:crop}');",
-      "bgc": "background-color:${1:#fff};",
+      "bgc": "background-color:#${1:fff};",
       "bgc:t": "background-color:transparent;",
       "bgi": "background-image:url(|);",
       "bgi:n": "background-image:none;",
@@ -322,7 +325,7 @@
       "bgsz:a": "background-size:auto;",
       "bgsz:ct": "background-size:contain;",
       "bgsz:cv": "background-size:cover;",
-      "c": "color:${1:#000};",
+      "c": "color:#${1:000};",
       "c:r": "color:rgb(${1:0}, ${2:0}, ${3:0});",
       "c:ra": "color:rgba(${1:0}, ${2:0}, ${3:0}, .${4:5});",
       "cm": "/* |${child} */",
@@ -335,8 +338,6 @@
       "cnt:a": "content:attr(|);",
       "cnt:c": "content:counter(|);",
       "cnt:cs": "content:counters(|);",
-
-
       "tbl": "table-layout:|;",
       "tbl:a": "table-layout:auto;",
       "tbl:f": "table-layout:fixed;",
@@ -424,7 +425,7 @@
       "tj:d": "text-justify:distribute;",
       "tj:k": "text-justify:kashida;",
       "tj:t": "text-justify:tibetan;",
-      "tov": "text-overflow:${1:ellipsis};",
+      "tov": "text-overflow:${ellipsis};",
       "tov:e": "text-overflow:ellipsis;",
       "tov:c": "text-overflow:clip;",
       "to": "text-outline:|;",
@@ -453,10 +454,17 @@
       "trf:sc": "transform: scale(${1:x}, ${2:y});",
       "trf:scx": "transform: scaleX(${1:x});",
       "trf:scy": "transform: scaleY(${1:y});",
+      "trf:scz": "transform: scaleZ(${1:z});",
+      "trf:sc3": "transform: scale3d(${1:x}, ${2:y}, ${3:z});",
       "trf:r": "transform: rotate(${1:angle});",
+      "trf:rx": "transform: rotateX(${1:angle});",
+      "trf:ry": "transform: rotateY(${1:angle});",
+      "trf:rz": "transform: rotateZ(${1:angle});",
       "trf:t": "transform: translate(${1:x}, ${2:y});",
       "trf:tx": "transform: translateX(${1:x});",
       "trf:ty": "transform: translateY(${1:y});",
+      "trf:tz": "transform: translateZ(${1:z});",
+      "trf:t3": "transform: translate3d(${1:tx}, ${2:ty}, ${3:tz});",
       "trfo": "transform-origin:|;",
       "trfs": "transform-style:${1:preserve-3d};",
       "trs": "transition:${1:prop} ${2:time};",
@@ -480,8 +488,6 @@
       "wob": "word-break:|;",
       "wob:n": "word-break:normal;",
       "wob:k": "word-break:keep-all;",
-      "wob:l": "word-break:loose;",
-      "wob:bs": "word-break:break-strict;",
       "wob:ba": "word-break:break-all;",
       "wos": "word-spacing:|;",
       "wow": "word-wrap:|;",
@@ -489,7 +495,18 @@
       "wow:n": "word-wrap:none;",
       "wow:u": "word-wrap:unrestricted;",
       "wow:s": "word-wrap:suppress;",
+      "wow:b": "word-wrap:break-word;",
+      "wm": "writing-mode:${1:lr-tb};",
+      "wm:lrt": "writing-mode:lr-tb;",
+      "wm:lrb": "writing-mode:lr-bt;",
+      "wm:rlt": "writing-mode:rl-tb;",
+      "wm:rlb": "writing-mode:rl-bt;",
+      "wm:tbr": "writing-mode:tb-rl;",
+      "wm:tbl": "writing-mode:tb-lr;",
+      "wm:btl": "writing-mode:bt-lr;",
+      "wm:btr": "writing-mode:bt-rl;",
       "lts": "letter-spacing:|;",
+      "lts-n": "letter-spacing:normal;",
       "f": "font:|;",
       "f+": "font:${1:1em} ${2:Arial,sans-serif};",
       "fw": "font-weight:|;",
@@ -497,7 +514,7 @@
       "fw:b": "font-weight:bold;",
       "fw:br": "font-weight:bolder;",
       "fw:lr": "font-weight:lighter;",
-      "fs": "font-style:${1:italic};",
+      "fs": "font-style:${italic};",
       "fs:n": "font-style:normal;",
       "fs:i": "font-style:italic;",
       "fs:o": "font-style:oblique;",
@@ -513,6 +530,9 @@
       "ff:c": "font-family:cursive;",
       "ff:f": "font-family:fantasy;",
       "ff:m": "font-family:monospace;",
+      "ff:a": "font-family: Arial, \"Helvetica Neue\", Helvetica, sans-serif;",
+      "ff:t": "font-family: \"Times New Roman\", Times, Baskerville, Georgia, serif;",
+      "ff:v": "font-family: Verdana, Geneva, sans-serif;",
       "fef": "font-effect:|;",
       "fef:n": "font-effect:none;",
       "fef:eg": "font-effect:engrave;",
@@ -543,6 +563,7 @@
       "fst:ee": "font-stretch:extra-expanded;",
       "fst:ue": "font-stretch:ultra-expanded;",
       "op": "opacity:|;",
+      "op+": "opacity: $1;\nfilter: alpha(opacity=$2);",
       "op:ie": "filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=100);",
       "op:ms": "-ms-filter:'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)';",
       "rsz": "resize:|;",
@@ -550,7 +571,7 @@
       "rsz:b": "resize:both;",
       "rsz:h": "resize:horizontal;",
       "rsz:v": "resize:vertical;",
-      "cur": "cursor:${1:pointer};",
+      "cur": "cursor:${pointer};",
       "cur:a": "cursor:auto;",
       "cur:d": "cursor:default;",
       "cur:c": "cursor:crosshair;",
@@ -559,6 +580,47 @@
       "cur:m": "cursor:move;",
       "cur:p": "cursor:pointer;",
       "cur:t": "cursor:text;",
+      "fxd": "flex-direction:|;",
+      "fxd:r": "flex-direction:row;",
+      "fxd:rr": "flex-direction:row-reverse;",
+      "fxd:c": "flex-direction:column;",
+      "fxd:cr": "flex-direction:column-reverse;",
+      "fxw": "flex-wrap: |;",
+      "fxw:n": "flex-wrap:nowrap;",
+      "fxw:w": "flex-wrap:wrap;",
+      "fxw:wr": "flex-wrap:wrap-reverse;",
+      "fxf": "flex-flow:|;",
+      "jc": "justify-content:|;",
+      "jc:fs": "justify-content:flex-start;",
+      "jc:fe": "justify-content:flex-end;",
+      "jc:c": "justify-content:center;",
+      "jc:sb": "justify-content:space-between;",
+      "jc:sa": "justify-content:space-around;",
+      "ai": "align-items:|;",
+      "ai:fs": "align-items:flex-start;",
+      "ai:fe": "align-items:flex-end;",
+      "ai:c": "align-items:center;",
+      "ai:b": "align-items:baseline;",
+      "ai:s": "align-items:stretch;",
+      "ac": "align-content:|;",
+      "ac:fs": "align-content:flex-start;",
+      "ac:fe": "align-content:flex-end;",
+      "ac:c": "align-content:center;",
+      "ac:sb": "align-content:space-between;",
+      "ac:sa": "align-content:space-around;",
+      "ac:s": "align-content:stretch;",
+      "ord": "order:|;",
+      "fxg": "flex-grow:|;",
+      "fxsh": "flex-shrink:|;",
+      "fxb": "flex-basis:|;",
+      "fx": "flex:|;",
+      "as": "align-self:|;",
+      "as:a": "align-self:auto;",
+      "as:fs": "align-self:flex-start;",
+      "as:fe": "align-self:flex-end;",
+      "as:c": "align-self:center;",
+      "as:b": "align-self:baseline;",
+      "as:s": "align-self:stretch;",
       "pgbb": "page-break-before:|;",
       "pgbb:au": "page-break-before:auto;",
       "pgbb:al": "page-break-before:always;",
@@ -573,9 +635,9 @@
       "pgba:l": "page-break-after:left;",
       "pgba:r": "page-break-after:right;",
       "orp": "orphans:|;",
-      "us": "user-select:${1:none};",
+      "us": "user-select:${none};",
       "wid": "widows:|;",
-      "wfsm": "-webkit-font-smoothing:${1:antialiased};",
+      "wfsm": "-webkit-font-smoothing:${antialiased};",
       "wfsm:a": "-webkit-font-smoothing:antialiased;",
       "wfsm:s": "-webkit-font-smoothing:subpixel-antialiased;",
       "wfsm:sa": "-webkit-font-smoothing:subpixel-antialiased;",
diff --git a/emmet-mode.el b/emmet-mode.el
index 3230e4b..13f1f1c 100644
--- a/emmet-mode.el
+++ b/emmet-mode.el
@@ -318,7 +318,7 @@ For more information see `emmet-mode'."
     (define-key map (kbd "<C-return>") 'emmet-expand-line)
     (define-key map (kbd "<C-M-right>") 'emmet-next-edit-point)
     (define-key map (kbd "<C-M-left>") 'emmet-prev-edit-point)
-    (define-key map (kbd "C-c w") 'emmet-wrap-with-markup)
+    (define-key map (kbd "C-c C-c w") 'emmet-wrap-with-markup)
     map)
   "Keymap for emmet minor mode.")
 
@@ -658,6 +658,11 @@ See `emmet-preview-online'."
 		(point))
 	      (forward-char)))))))
 
+(defcustom emmet-postwrap-goto-edit-point nil
+  "Goto first edit point after wrapping markup?"
+  :type 'boolean
+  :group 'emmet)
+
 ;;;###autoload
 (defun emmet-wrap-with-markup (wrap-with)
   "Wrap region with markup."
@@ -667,12 +672,23 @@ See `emmet-preview-online'."
          (to-wrap (if multi
                       (split-string txt "\n")
                     (list txt)))
-         (initial-elements (replace-regexp-in-string "\\(.*\\(\\+\\|>\\)\\)?[^>*]+\\*?[[:digit:]]*$" "\\1" wrap-with t))
-         (terminal-element (replace-regexp-in-string "\\(.*>\\)?\\([^>*]+\\)\\(\\*[[:digit:]]+$\\)?\\*?$" "\\2" wrap-with t))
-         (multiplier-expr (replace-regexp-in-string "\\(.*>\\)?\\([^>*]+\\)\\(\\*[[:digit:]]+$\\)?\\*?$" "\\3" wrap-with t))
+         (initial-elements (replace-regexp-in-string
+                            "\\(.*\\(\\+\\|>\\)\\)?[^>*]+\\*?[[:digit:]]*$"
+                            "\\1" wrap-with t))
+         (terminal-element (replace-regexp-in-string
+                            "\\(.*>\\)?\\([^>*]+\\)\\(\\*[[:digit:]]+$\\)?\\*?$"
+                            "\\2" wrap-with t))
+         (multiplier-expr (replace-regexp-in-string
+                           "\\(.*>\\)?\\([^>*]+\\)\\(\\*[[:digit:]]+$\\)?\\*?$"
+                           "\\3" wrap-with t))
          (expr (concat
                 initial-elements
-                (mapconcat (lambda (el) (concat terminal-element "{!!!" (secure-hash 'sha1 el) "!!!}" multiplier-expr))
+                (mapconcat (lambda (el)
+                             (concat terminal-element
+                                     "{!!!"
+                                     (secure-hash 'sha1 el)
+                                     "!!!}"
+                                     multiplier-expr))
                            to-wrap
                            "+")))
          (markup
@@ -688,11 +704,12 @@ See `emmet-preview-online'."
       (delete-region (region-beginning) (region-end))
       (insert markup)
       (indent-region (region-beginning) (region-end))
-      (let ((end (region-end)))
-        (goto-char (region-beginning))
-        (unless (ignore-errors (progn (emmet-next-edit-point 1) t))
-          (goto-char end)))
-      )))
+      (if emmet-postwrap-goto-edit-point
+          (let ((end (region-end)))
+            (goto-char (region-beginning))
+            (unless (ignore-errors (progn (emmet-next-edit-point 1) t))
+              (goto-char end)))
+        ))))
 
 ;;;###autoload
 (defun emmet-next-edit-point (count)
@@ -722,6 +739,19 @@ See `emmet-preview-online'."
 (puthash "@kf" "@-webkit-keyframes ${1:identifier} {\n\t${2:from} { ${3} }${6}\n\t${4:to} { ${5} }\n}\n@-o-keyframes ${1:identifier} {\n\t${2:from} { ${3} }${6}\n\t${4:to} { ${5} }\n}\n@-moz-keyframes ${1:identifier} {\n\t${2:from} { ${3} }${6}\n\t${4:to} { ${5} }\n}\n@keyframes ${1:identifier} {\n\t${2:from} { ${3} }${6}\n\t${4:to} { ${5} }\n}" tbl)
 (puthash "@m" "@media ${1:screen} {\n\t|\n}" tbl)
 (puthash "@media" "@media ${1:screen} {\n\t|\n}" tbl)
+(puthash "ac" "align-content:|;" tbl)
+(puthash "ac:c" "align-content:center;" tbl)
+(puthash "ac:fe" "align-content:flex-end;" tbl)
+(puthash "ac:fs" "align-content:flex-start;" tbl)
+(puthash "ac:s" "align-content:stretch;" tbl)
+(puthash "ac:sa" "align-content:space-around;" tbl)
+(puthash "ac:sb" "align-content:space-between;" tbl)
+(puthash "ai" "align-items:|;" tbl)
+(puthash "ai:b" "align-items:baseline;" tbl)
+(puthash "ai:c" "align-items:center;" tbl)
+(puthash "ai:fe" "align-items:flex-end;" tbl)
+(puthash "ai:fs" "align-items:flex-start;" tbl)
+(puthash "ai:s" "align-items:stretch;" tbl)
 (puthash "anim" "animation:|;" tbl)
 (puthash "anim-" "animation:${1:name} ${2:duration} ${3:timing-function} ${4:delay} ${5:iteration-count} ${6:direction} ${7:fill-mode};" tbl)
 (puthash "animdel" "animation-delay:${1:time};" tbl)
@@ -749,7 +779,14 @@ See `emmet-preview-online'."
 (puthash "animtf:eio" "animation-timing-function:ease-in-out;" tbl)
 (puthash "animtf:eo" "animation-timing-function:ease-out;" tbl)
 (puthash "animtf:l" "animation-timing-function:linear;" tbl)
-(puthash "ap" "appearance:${1:none};" tbl)
+(puthash "ap" "appearance:${none};" tbl)
+(puthash "as" "align-self:|;" tbl)
+(puthash "as:a" "align-self:auto;" tbl)
+(puthash "as:b" "align-self:baseline;" tbl)
+(puthash "as:c" "align-self:center;" tbl)
+(puthash "as:fe" "align-self:flex-end;" tbl)
+(puthash "as:fs" "align-self:flex-start;" tbl)
+(puthash "as:s" "align-self:stretch;" tbl)
 (puthash "b" "bottom:|;" tbl)
 (puthash "b:a" "bottom:auto;" tbl)
 (puthash "bb" "border-bottom:|;" tbl)
@@ -759,7 +796,7 @@ See `emmet-preview-online'."
 (puthash "bdb" "border-bottom:|;" tbl)
 (puthash "bdb+" "border-bottom:${1:1px} ${2:solid} ${3:#000};" tbl)
 (puthash "bdb:n" "border-bottom:none;" tbl)
-(puthash "bdbc" "border-bottom-color:${1:#000};" tbl)
+(puthash "bdbc" "border-bottom-color:#${1:000};" tbl)
 (puthash "bdbc:t" "border-bottom-color:transparent;" tbl)
 (puthash "bdbi" "border-bottom-image:url(|);" tbl)
 (puthash "bdbi:n" "border-bottom-image:none;" tbl)
@@ -776,7 +813,7 @@ See `emmet-preview-online'."
 (puthash "bdbs" "border-bottom-style:|;" tbl)
 (puthash "bdbs:n" "border-bottom-style:none;" tbl)
 (puthash "bdbw" "border-bottom-width:|;" tbl)
-(puthash "bdc" "border-color:${1:#000};" tbl)
+(puthash "bdc" "border-color:#${1:000};" tbl)
 (puthash "bdc:t" "border-color:transparent;" tbl)
 (puthash "bdci" "border-corner-image:url(|);" tbl)
 (puthash "bdci:c" "border-corner-image:continue;" tbl)
@@ -797,7 +834,7 @@ See `emmet-preview-online'."
 (puthash "bdl" "border-left:|;" tbl)
 (puthash "bdl+" "border-left:${1:1px} ${2:solid} ${3:#000};" tbl)
 (puthash "bdl:n" "border-left:none;" tbl)
-(puthash "bdlc" "border-left-color:${1:#000};" tbl)
+(puthash "bdlc" "border-left-color:#${1:000};" tbl)
 (puthash "bdlc:t" "border-left-color:transparent;" tbl)
 (puthash "bdlen" "border-length:|;" tbl)
 (puthash "bdlen:a" "border-length:auto;" tbl)
@@ -809,7 +846,7 @@ See `emmet-preview-online'."
 (puthash "bdr" "border-right:|;" tbl)
 (puthash "bdr+" "border-right:${1:1px} ${2:solid} ${3:#000};" tbl)
 (puthash "bdr:n" "border-right:none;" tbl)
-(puthash "bdrc" "border-right-color:${1:#000};" tbl)
+(puthash "bdrc" "border-right-color:#${1:000};" tbl)
 (puthash "bdrc:t" "border-right-color:transparent;" tbl)
 (puthash "bdri" "border-right-image:url(|);" tbl)
 (puthash "bdri:n" "border-right-image:none;" tbl)
@@ -835,7 +872,7 @@ See `emmet-preview-online'."
 (puthash "bdt" "border-top:|;" tbl)
 (puthash "bdt+" "border-top:${1:1px} ${2:solid} ${3:#000};" tbl)
 (puthash "bdt:n" "border-top:none;" tbl)
-(puthash "bdtc" "border-top-color:${1:#000};" tbl)
+(puthash "bdtc" "border-top-color:#${1:000};" tbl)
 (puthash "bdtc:t" "border-top-color:transparent;" tbl)
 (puthash "bdti" "border-top-image:url(|);" tbl)
 (puthash "bdti:n" "border-top-image:none;" tbl)
@@ -851,7 +888,10 @@ See `emmet-preview-online'."
 (puthash "bdts:n" "border-top-style:none;" tbl)
 (puthash "bdtw" "border-top-width:|;" tbl)
 (puthash "bdw" "border-width:|;" tbl)
-(puthash "bg" "background:|;" tbl)
+(puthash "bfv" "backface-visibility:|;" tbl)
+(puthash "bfv:h" "backface-visibility:hidden;" tbl)
+(puthash "bfv:v" "backface-visibility:visible;" tbl)
+(puthash "bg" "background:#${1:000};" tbl)
 (puthash "bg+" "background:${1:#fff} url(${2}) ${3:0} ${4:0} ${5:no-repeat};" tbl)
 (puthash "bg:ie" "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='${1:x}.png',sizingMethod='${2:crop}');" tbl)
 (puthash "bg:n" "background:none;" tbl)
@@ -862,7 +902,7 @@ See `emmet-preview-online'."
 (puthash "bgbk:bb" "background-break:bounding-box;" tbl)
 (puthash "bgbk:c" "background-break:continuous;" tbl)
 (puthash "bgbk:eb" "background-break:each-box;" tbl)
-(puthash "bgc" "background-color:${1:#fff};" tbl)
+(puthash "bgc" "background-color:#${1:fff};" tbl)
 (puthash "bgc:t" "background-color:transparent;" tbl)
 (puthash "bgcp" "background-clip:${1:padding-box};" tbl)
 (puthash "bgcp:bb" "background-clip:border-box;" tbl)
@@ -898,7 +938,7 @@ See `emmet-preview-online'."
 (puthash "bxz" "box-sizing:${1:border-box};" tbl)
 (puthash "bxz:bb" "box-sizing:border-box;" tbl)
 (puthash "bxz:cb" "box-sizing:content-box;" tbl)
-(puthash "c" "color:${1:#000};" tbl)
+(puthash "c" "color:#${1:000};" tbl)
 (puthash "c:r" "color:rgb(${1:0}, ${2:0}, ${3:0});" tbl)
 (puthash "c:ra" "color:rgba(${1:0}, ${2:0}, ${3:0}, .${4:5});" tbl)
 (puthash "cl" "clear:${1:both};" tbl)
@@ -943,7 +983,7 @@ See `emmet-preview-online'."
 (puthash "ct:ncq" "content:no-close-quote;" tbl)
 (puthash "ct:noq" "content:no-open-quote;" tbl)
 (puthash "ct:oq" "content:open-quote;" tbl)
-(puthash "cur" "cursor:${1:pointer};" tbl)
+(puthash "cur" "cursor:${pointer};" tbl)
 (puthash "cur:a" "cursor:auto;" tbl)
 (puthash "cur:c" "cursor:crosshair;" tbl)
 (puthash "cur:d" "cursor:default;" tbl)
@@ -955,8 +995,11 @@ See `emmet-preview-online'."
 (puthash "d" "display:${1:block};" tbl)
 (puthash "d:b" "display:block;" tbl)
 (puthash "d:cp" "display:compact;" tbl)
+(puthash "d:f" "display:flex;" tbl)
 (puthash "d:i" "display:inline;" tbl)
 (puthash "d:ib" "display:inline-block;" tbl)
+(puthash "d:ib+" "display: inline-block;\n*display: inline;\n*zoom: 1;" tbl)
+(puthash "d:if" "display:inline-flex;" tbl)
 (puthash "d:itb" "display:inline-table;" tbl)
 (puthash "d:li" "display:list-item;" tbl)
 (puthash "d:n" "display:none;" tbl)
@@ -996,16 +1039,19 @@ See `emmet-preview-online'."
 (puthash "fems:dt" "font-emphasize-style:dot;" tbl)
 (puthash "fems:n" "font-emphasize-style:none;" tbl)
 (puthash "ff" "font-family:|;" tbl)
+(puthash "ff:a" "font-family: Arial, \"Helvetica Neue\", Helvetica, sans-serif;" tbl)
 (puthash "ff:c" "font-family:cursive;" tbl)
 (puthash "ff:f" "font-family:fantasy;" tbl)
 (puthash "ff:m" "font-family:monospace;" tbl)
 (puthash "ff:s" "font-family:serif;" tbl)
 (puthash "ff:ss" "font-family:sans-serif;" tbl)
+(puthash "ff:t" "font-family: \"Times New Roman\", Times, Baskerville, Georgia, serif;" tbl)
+(puthash "ff:v" "font-family: Verdana, Geneva, sans-serif;" tbl)
 (puthash "fl" "float:${1:left};" tbl)
 (puthash "fl:l" "float:left;" tbl)
 (puthash "fl:n" "float:none;" tbl)
 (puthash "fl:r" "float:right;" tbl)
-(puthash "fs" "font-style:${1:italic};" tbl)
+(puthash "fs" "font-style:${italic};" tbl)
 (puthash "fs:i" "font-style:italic;" tbl)
 (puthash "fs:n" "font-style:normal;" tbl)
 (puthash "fs:o" "font-style:oblique;" tbl)
@@ -1031,11 +1077,31 @@ See `emmet-preview-online'."
 (puthash "fw:br" "font-weight:bolder;" tbl)
 (puthash "fw:lr" "font-weight:lighter;" tbl)
 (puthash "fw:n" "font-weight:normal;" tbl)
+(puthash "fx" "flex:|;" tbl)
+(puthash "fxb" "flex-basis:|;" tbl)
+(puthash "fxd" "flex-direction:|;" tbl)
+(puthash "fxd:c" "flex-direction:column;" tbl)
+(puthash "fxd:cr" "flex-direction:column-reverse;" tbl)
+(puthash "fxd:r" "flex-direction:row;" tbl)
+(puthash "fxd:rr" "flex-direction:row-reverse;" tbl)
+(puthash "fxf" "flex-flow:|;" tbl)
+(puthash "fxg" "flex-grow:|;" tbl)
+(puthash "fxsh" "flex-shrink:|;" tbl)
+(puthash "fxw" "flex-wrap: |;" tbl)
+(puthash "fxw:n" "flex-wrap:nowrap;" tbl)
+(puthash "fxw:w" "flex-wrap:wrap;" tbl)
+(puthash "fxw:wr" "flex-wrap:wrap-reverse;" tbl)
 (puthash "fz" "font-size:|;" tbl)
 (puthash "fza" "font-size-adjust:|;" tbl)
 (puthash "fza:n" "font-size-adjust:none;" tbl)
 (puthash "h" "height:|;" tbl)
 (puthash "h:a" "height:auto;" tbl)
+(puthash "jc" "justify-content:|;" tbl)
+(puthash "jc:c" "justify-content:center;" tbl)
+(puthash "jc:fe" "justify-content:flex-end;" tbl)
+(puthash "jc:fs" "justify-content:flex-start;" tbl)
+(puthash "jc:sa" "justify-content:space-around;" tbl)
+(puthash "jc:sb" "justify-content:space-between;" tbl)
 (puthash "l" "left:|;" tbl)
 (puthash "l:a" "left:auto;" tbl)
 (puthash "lh" "line-height:|;" tbl)
@@ -1056,6 +1122,7 @@ See `emmet-preview-online'."
 (puthash "list:s" "list-style-type:square;" tbl)
 (puthash "list:ur" "list-style-type:upper-roman;" tbl)
 (puthash "lts" "letter-spacing:|;" tbl)
+(puthash "lts-n" "letter-spacing:normal;" tbl)
 (puthash "m" "margin:|;" tbl)
 (puthash "m:a" "margin:auto;" tbl)
 (puthash "mah" "max-height:|;" tbl)
@@ -1076,14 +1143,28 @@ See `emmet-preview-online'."
 (puthash "mt:a" "margin-top:auto;" tbl)
 (puthash "ol" "outline:|;" tbl)
 (puthash "ol:n" "outline:none;" tbl)
-(puthash "olc" "outline-color:${1:#000};" tbl)
+(puthash "olc" "outline-color:#${1:000};" tbl)
 (puthash "olc:i" "outline-color:invert;" tbl)
 (puthash "olo" "outline-offset:|;" tbl)
 (puthash "ols" "outline-style:|;" tbl)
+(puthash "ols:db" "outline-style:double;" tbl)
+(puthash "ols:ds" "outline-style:dashed;" tbl)
+(puthash "ols:dt" "outline-style:dotted;" tbl)
+(puthash "ols:g" "outline-style:groove;" tbl)
+(puthash "ols:i" "outline-style:inset;" tbl)
+(puthash "ols:n" "outline-style:none;" tbl)
+(puthash "ols:o" "outline-style:outset;" tbl)
+(puthash "ols:r" "outline-style:ridge;" tbl)
+(puthash "ols:s" "outline-style:solid;" tbl)
 (puthash "olw" "outline-width:|;" tbl)
+(puthash "olw:m" "outline-width:medium;" tbl)
+(puthash "olw:tc" "outline-width:thick;" tbl)
+(puthash "olw:tn" "outline-width:thin;" tbl)
 (puthash "op" "opacity:|;" tbl)
+(puthash "op+" "opacity: $1;\nfilter: alpha(opacity=$2);" tbl)
 (puthash "op:ie" "filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=100);" tbl)
 (puthash "op:ms" "-ms-filter:'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)';" tbl)
+(puthash "ord" "order:|;" tbl)
 (puthash "ori" "orientation:|;" tbl)
 (puthash "ori:l" "orientation:landscape;" tbl)
 (puthash "ori:p" "orientation:portrait;" tbl)
@@ -1189,21 +1270,28 @@ See `emmet-preview-online'."
 (puthash "to" "text-outline:|;" tbl)
 (puthash "to+" "text-outline:${1:0} ${2:0} ${3:#000};" tbl)
 (puthash "to:n" "text-outline:none;" tbl)
-(puthash "tov" "text-overflow:${1:ellipsis};" tbl)
+(puthash "tov" "text-overflow:${ellipsis};" tbl)
 (puthash "tov:c" "text-overflow:clip;" tbl)
 (puthash "tov:e" "text-overflow:ellipsis;" tbl)
 (puthash "tr" "text-replace:|;" tbl)
 (puthash "tr:n" "text-replace:none;" tbl)
 (puthash "trf" "transform:|;" tbl)
 (puthash "trf:r" "transform: rotate(${1:angle});" tbl)
+(puthash "trf:rx" "transform: rotateX(${1:angle});" tbl)
+(puthash "trf:ry" "transform: rotateY(${1:angle});" tbl)
+(puthash "trf:rz" "transform: rotateZ(${1:angle});" tbl)
 (puthash "trf:sc" "transform: scale(${1:x}, ${2:y});" tbl)
+(puthash "trf:sc3" "transform: scale3d(${1:x}, ${2:y}, ${3:z});" tbl)
 (puthash "trf:scx" "transform: scaleX(${1:x});" tbl)
 (puthash "trf:scy" "transform: scaleY(${1:y});" tbl)
+(puthash "trf:scz" "transform: scaleZ(${1:z});" tbl)
 (puthash "trf:skx" "transform: skewX(${1:angle});" tbl)
 (puthash "trf:sky" "transform: skewY(${1:angle});" tbl)
 (puthash "trf:t" "transform: translate(${1:x}, ${2:y});" tbl)
+(puthash "trf:t3" "transform: translate3d(${1:tx}, ${2:ty}, ${3:tz});" tbl)
 (puthash "trf:tx" "transform: translateX(${1:x});" tbl)
 (puthash "trf:ty" "transform: translateY(${1:y});" tbl)
+(puthash "trf:tz" "transform: translateZ(${1:z});" tbl)
 (puthash "trfo" "transform-origin:|;" tbl)
 (puthash "trfs" "transform-style:${1:preserve-3d};" tbl)
 (puthash "trs" "transition:${1:prop} ${2:time};" tbl)
@@ -1226,7 +1314,7 @@ See `emmet-preview-online'."
 (puthash "tw:no" "text-wrap:none;" tbl)
 (puthash "tw:s" "text-wrap:suppress;" tbl)
 (puthash "tw:u" "text-wrap:unrestricted;" tbl)
-(puthash "us" "user-select:${1:none};" tbl)
+(puthash "us" "user-select:${none};" tbl)
 (puthash "v" "visibility:${1:hidden};" tbl)
 (puthash "v:c" "visibility:collapse;" tbl)
 (puthash "v:h" "visibility:hidden;" tbl)
@@ -1242,7 +1330,7 @@ See `emmet-preview-online'."
 (puthash "va:tt" "vertical-align:text-top;" tbl)
 (puthash "w" "width:|;" tbl)
 (puthash "w:a" "width:auto;" tbl)
-(puthash "wfsm" "-webkit-font-smoothing:${1:antialiased};" tbl)
+(puthash "wfsm" "-webkit-font-smoothing:${antialiased};" tbl)
 (puthash "wfsm:a" "-webkit-font-smoothing:antialiased;" tbl)
 (puthash "wfsm:n" "-webkit-font-smoothing:none;" tbl)
 (puthash "wfsm:s" "-webkit-font-smoothing:subpixel-antialiased;" tbl)
@@ -1260,14 +1348,22 @@ See `emmet-preview-online'."
 (puthash "whsc:l" "white-space-collapse:loose;" tbl)
 (puthash "whsc:n" "white-space-collapse:normal;" tbl)
 (puthash "wid" "widows:|;" tbl)
+(puthash "wm" "writing-mode:${1:lr-tb};" tbl)
+(puthash "wm:btl" "writing-mode:bt-lr;" tbl)
+(puthash "wm:btr" "writing-mode:bt-rl;" tbl)
+(puthash "wm:lrb" "writing-mode:lr-bt;" tbl)
+(puthash "wm:lrt" "writing-mode:lr-tb;" tbl)
+(puthash "wm:rlb" "writing-mode:rl-bt;" tbl)
+(puthash "wm:rlt" "writing-mode:rl-tb;" tbl)
+(puthash "wm:tbl" "writing-mode:tb-lr;" tbl)
+(puthash "wm:tbr" "writing-mode:tb-rl;" tbl)
 (puthash "wob" "word-break:|;" tbl)
 (puthash "wob:ba" "word-break:break-all;" tbl)
-(puthash "wob:bs" "word-break:break-strict;" tbl)
 (puthash "wob:k" "word-break:keep-all;" tbl)
-(puthash "wob:l" "word-break:loose;" tbl)
 (puthash "wob:n" "word-break:normal;" tbl)
 (puthash "wos" "word-spacing:|;" tbl)
 (puthash "wow" "word-wrap:|;" tbl)
+(puthash "wow:b" "word-wrap:break-word;" tbl)
 (puthash "wow:n" "word-wrap:none;" tbl)
 (puthash "wow:nm" "word-wrap:normal;" tbl)
 (puthash "wow:s" "word-wrap:suppress;" tbl)
diff --git a/src/mode-def.el b/src/mode-def.el
index c0e3e2c..67313dd 100644
--- a/src/mode-def.el
+++ b/src/mode-def.el
@@ -158,7 +158,7 @@ For more information see `emmet-mode'."
     (define-key map (kbd "<C-return>") 'emmet-expand-line)
     (define-key map (kbd "<C-M-right>") 'emmet-next-edit-point)
     (define-key map (kbd "<C-M-left>") 'emmet-prev-edit-point)
-    (define-key map (kbd "C-c w") 'emmet-wrap-with-markup)
+    (define-key map (kbd "C-c C-c w") 'emmet-wrap-with-markup)
     map)
   "Keymap for emmet minor mode.")
 
@@ -190,7 +190,7 @@ This minor mode defines keys for quick access:
 Home page URL `http://www.emacswiki.org/emacs/Emmet'.
 
 See also `emmet-expand-line'."
-  :lighter " Emmet"
+  :lighter (" Emmet" (:eval (if emmet-preview-mode "[P]" "")))
   :keymap emmet-mode-keymap
   :after-hook (emmet-after-hook))
 
@@ -373,6 +373,34 @@ accept it or skip it."
         (goto-char here)
         (add-hook 'post-command-hook 'emmet-preview-post-command t t)))))
 
+(defun emmet-preview-online ()
+  "Display `emmet-preview' on the fly as the user types.
+
+To use this, add the function as a local hook:
+
+  (add-hook 'post-self-insert-hook 'emmet-preview-online t t)
+
+or enable `emmet-preview-mode'."
+  (ignore-errors
+    (let* ((expr (emmet-expr-on-line))
+           (text (nth 0 expr))
+           (beg (nth 1 expr))
+           (end (nth 2 expr)))
+      (let ((wap (word-at-point)))
+        (when (and (not (equal wap text))
+                   (emmet-transform text))
+          (emmet-preview beg end))))))
+
+(define-minor-mode emmet-preview-mode
+  "When enabled, automatically show `emmet-preview' as the user types.
+
+See `emmet-preview-online'."
+  :init-value nil
+  :group 'emmet
+  (if emmet-preview-mode
+      (add-hook 'post-self-insert-hook 'emmet-preview-online :append :local)
+    (remove-hook 'post-self-insert-hook 'emmet-preview-online :local)))
+
 (defvar emmet-preview-pending-abort nil)
 (make-variable-buffer-local 'emmet-preview-pending-abort)
 
@@ -470,6 +498,11 @@ accept it or skip it."
 		(point))
 	      (forward-char)))))))
 
+(defcustom emmet-postwrap-goto-edit-point nil
+  "Goto first edit point after wrapping markup?"
+  :type 'boolean
+  :group 'emmet)
+
 ;;;###autoload
 (defun emmet-wrap-with-markup (wrap-with)
   "Wrap region with markup."
@@ -479,12 +512,23 @@ accept it or skip it."
          (to-wrap (if multi
                       (split-string txt "\n")
                     (list txt)))
-         (initial-elements (replace-regexp-in-string "\\(.*\\(\\+\\|>\\)\\)?[^>*]+\\*?[[:digit:]]*$" "\\1" wrap-with t))
-         (terminal-element (replace-regexp-in-string "\\(.*>\\)?\\([^>*]+\\)\\(\\*[[:digit:]]+$\\)?\\*?$" "\\2" wrap-with t))
-         (multiplier-expr (replace-regexp-in-string "\\(.*>\\)?\\([^>*]+\\)\\(\\*[[:digit:]]+$\\)?\\*?$" "\\3" wrap-with t))
+         (initial-elements (replace-regexp-in-string
+                            "\\(.*\\(\\+\\|>\\)\\)?[^>*]+\\*?[[:digit:]]*$"
+                            "\\1" wrap-with t))
+         (terminal-element (replace-regexp-in-string
+                            "\\(.*>\\)?\\([^>*]+\\)\\(\\*[[:digit:]]+$\\)?\\*?$"
+                            "\\2" wrap-with t))
+         (multiplier-expr (replace-regexp-in-string
+                           "\\(.*>\\)?\\([^>*]+\\)\\(\\*[[:digit:]]+$\\)?\\*?$"
+                           "\\3" wrap-with t))
          (expr (concat
                 initial-elements
-                (mapconcat (lambda (el) (concat terminal-element "{!!!" (secure-hash 'sha1 el) "!!!}" multiplier-expr))
+                (mapconcat (lambda (el)
+                             (concat terminal-element
+                                     "{!!!"
+                                     (secure-hash 'sha1 el)
+                                     "!!!}"
+                                     multiplier-expr))
                            to-wrap
                            "+")))
          (markup
@@ -500,11 +544,12 @@ accept it or skip it."
       (delete-region (region-beginning) (region-end))
       (insert markup)
       (indent-region (region-beginning) (region-end))
-      (let ((end (region-end)))
-        (goto-char (region-beginning))
-        (unless (ignore-errors (progn (emmet-next-edit-point 1) t))
-          (goto-char end)))
-      )))
+      (if emmet-postwrap-goto-edit-point
+          (let ((end (region-end)))
+            (goto-char (region-beginning))
+            (unless (ignore-errors (progn (emmet-next-edit-point 1) t))
+              (goto-char end)))
+        ))))
 
 ;;;###autoload
 (defun emmet-next-edit-point (count)
diff --git a/src/snippets.el b/src/snippets.el
index 95120f4..9d82999 100644
--- a/src/snippets.el
+++ b/src/snippets.el
@@ -13,6 +13,19 @@
 (puthash "@kf" "@-webkit-keyframes ${1:identifier} {\n\t${2:from} { ${3} }${6}\n\t${4:to} { ${5} }\n}\n@-o-keyframes ${1:identifier} {\n\t${2:from} { ${3} }${6}\n\t${4:to} { ${5} }\n}\n@-moz-keyframes ${1:identifier} {\n\t${2:from} { ${3} }${6}\n\t${4:to} { ${5} }\n}\n@keyframes ${1:identifier} {\n\t${2:from} { ${3} }${6}\n\t${4:to} { ${5} }\n}" tbl)
 (puthash "@m" "@media ${1:screen} {\n\t|\n}" tbl)
 (puthash "@media" "@media ${1:screen} {\n\t|\n}" tbl)
+(puthash "ac" "align-content:|;" tbl)
+(puthash "ac:c" "align-content:center;" tbl)
+(puthash "ac:fe" "align-content:flex-end;" tbl)
+(puthash "ac:fs" "align-content:flex-start;" tbl)
+(puthash "ac:s" "align-content:stretch;" tbl)
+(puthash "ac:sa" "align-content:space-around;" tbl)
+(puthash "ac:sb" "align-content:space-between;" tbl)
+(puthash "ai" "align-items:|;" tbl)
+(puthash "ai:b" "align-items:baseline;" tbl)
+(puthash "ai:c" "align-items:center;" tbl)
+(puthash "ai:fe" "align-items:flex-end;" tbl)
+(puthash "ai:fs" "align-items:flex-start;" tbl)
+(puthash "ai:s" "align-items:stretch;" tbl)
 (puthash "anim" "animation:|;" tbl)
 (puthash "anim-" "animation:${1:name} ${2:duration} ${3:timing-function} ${4:delay} ${5:iteration-count} ${6:direction} ${7:fill-mode};" tbl)
 (puthash "animdel" "animation-delay:${1:time};" tbl)
@@ -40,7 +53,14 @@
 (puthash "animtf:eio" "animation-timing-function:ease-in-out;" tbl)
 (puthash "animtf:eo" "animation-timing-function:ease-out;" tbl)
 (puthash "animtf:l" "animation-timing-function:linear;" tbl)
-(puthash "ap" "appearance:${1:none};" tbl)
+(puthash "ap" "appearance:${none};" tbl)
+(puthash "as" "align-self:|;" tbl)
+(puthash "as:a" "align-self:auto;" tbl)
+(puthash "as:b" "align-self:baseline;" tbl)
+(puthash "as:c" "align-self:center;" tbl)
+(puthash "as:fe" "align-self:flex-end;" tbl)
+(puthash "as:fs" "align-self:flex-start;" tbl)
+(puthash "as:s" "align-self:stretch;" tbl)
 (puthash "b" "bottom:|;" tbl)
 (puthash "b:a" "bottom:auto;" tbl)
 (puthash "bb" "border-bottom:|;" tbl)
@@ -50,7 +70,7 @@
 (puthash "bdb" "border-bottom:|;" tbl)
 (puthash "bdb+" "border-bottom:${1:1px} ${2:solid} ${3:#000};" tbl)
 (puthash "bdb:n" "border-bottom:none;" tbl)
-(puthash "bdbc" "border-bottom-color:${1:#000};" tbl)
+(puthash "bdbc" "border-bottom-color:#${1:000};" tbl)
 (puthash "bdbc:t" "border-bottom-color:transparent;" tbl)
 (puthash "bdbi" "border-bottom-image:url(|);" tbl)
 (puthash "bdbi:n" "border-bottom-image:none;" tbl)
@@ -67,7 +87,7 @@
 (puthash "bdbs" "border-bottom-style:|;" tbl)
 (puthash "bdbs:n" "border-bottom-style:none;" tbl)
 (puthash "bdbw" "border-bottom-width:|;" tbl)
-(puthash "bdc" "border-color:${1:#000};" tbl)
+(puthash "bdc" "border-color:#${1:000};" tbl)
 (puthash "bdc:t" "border-color:transparent;" tbl)
 (puthash "bdci" "border-corner-image:url(|);" tbl)
 (puthash "bdci:c" "border-corner-image:continue;" tbl)
@@ -88,7 +108,7 @@
 (puthash "bdl" "border-left:|;" tbl)
 (puthash "bdl+" "border-left:${1:1px} ${2:solid} ${3:#000};" tbl)
 (puthash "bdl:n" "border-left:none;" tbl)
-(puthash "bdlc" "border-left-color:${1:#000};" tbl)
+(puthash "bdlc" "border-left-color:#${1:000};" tbl)
 (puthash "bdlc:t" "border-left-color:transparent;" tbl)
 (puthash "bdlen" "border-length:|;" tbl)
 (puthash "bdlen:a" "border-length:auto;" tbl)
@@ -100,7 +120,7 @@
 (puthash "bdr" "border-right:|;" tbl)
 (puthash "bdr+" "border-right:${1:1px} ${2:solid} ${3:#000};" tbl)
 (puthash "bdr:n" "border-right:none;" tbl)
-(puthash "bdrc" "border-right-color:${1:#000};" tbl)
+(puthash "bdrc" "border-right-color:#${1:000};" tbl)
 (puthash "bdrc:t" "border-right-color:transparent;" tbl)
 (puthash "bdri" "border-right-image:url(|);" tbl)
 (puthash "bdri:n" "border-right-image:none;" tbl)
@@ -126,7 +146,7 @@
 (puthash "bdt" "border-top:|;" tbl)
 (puthash "bdt+" "border-top:${1:1px} ${2:solid} ${3:#000};" tbl)
 (puthash "bdt:n" "border-top:none;" tbl)
-(puthash "bdtc" "border-top-color:${1:#000};" tbl)
+(puthash "bdtc" "border-top-color:#${1:000};" tbl)
 (puthash "bdtc:t" "border-top-color:transparent;" tbl)
 (puthash "bdti" "border-top-image:url(|);" tbl)
 (puthash "bdti:n" "border-top-image:none;" tbl)
@@ -142,7 +162,10 @@
 (puthash "bdts:n" "border-top-style:none;" tbl)
 (puthash "bdtw" "border-top-width:|;" tbl)
 (puthash "bdw" "border-width:|;" tbl)
-(puthash "bg" "background:|;" tbl)
+(puthash "bfv" "backface-visibility:|;" tbl)
+(puthash "bfv:h" "backface-visibility:hidden;" tbl)
+(puthash "bfv:v" "backface-visibility:visible;" tbl)
+(puthash "bg" "background:#${1:000};" tbl)
 (puthash "bg+" "background:${1:#fff} url(${2}) ${3:0} ${4:0} ${5:no-repeat};" tbl)
 (puthash "bg:ie" "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='${1:x}.png',sizingMethod='${2:crop}');" tbl)
 (puthash "bg:n" "background:none;" tbl)
@@ -153,7 +176,7 @@
 (puthash "bgbk:bb" "background-break:bounding-box;" tbl)
 (puthash "bgbk:c" "background-break:continuous;" tbl)
 (puthash "bgbk:eb" "background-break:each-box;" tbl)
-(puthash "bgc" "background-color:${1:#fff};" tbl)
+(puthash "bgc" "background-color:#${1:fff};" tbl)
 (puthash "bgc:t" "background-color:transparent;" tbl)
 (puthash "bgcp" "background-clip:${1:padding-box};" tbl)
 (puthash "bgcp:bb" "background-clip:border-box;" tbl)
@@ -189,7 +212,7 @@
 (puthash "bxz" "box-sizing:${1:border-box};" tbl)
 (puthash "bxz:bb" "box-sizing:border-box;" tbl)
 (puthash "bxz:cb" "box-sizing:content-box;" tbl)
-(puthash "c" "color:${1:#000};" tbl)
+(puthash "c" "color:#${1:000};" tbl)
 (puthash "c:r" "color:rgb(${1:0}, ${2:0}, ${3:0});" tbl)
 (puthash "c:ra" "color:rgba(${1:0}, ${2:0}, ${3:0}, .${4:5});" tbl)
 (puthash "cl" "clear:${1:both};" tbl)
@@ -234,7 +257,7 @@
 (puthash "ct:ncq" "content:no-close-quote;" tbl)
 (puthash "ct:noq" "content:no-open-quote;" tbl)
 (puthash "ct:oq" "content:open-quote;" tbl)
-(puthash "cur" "cursor:${1:pointer};" tbl)
+(puthash "cur" "cursor:${pointer};" tbl)
 (puthash "cur:a" "cursor:auto;" tbl)
 (puthash "cur:c" "cursor:crosshair;" tbl)
 (puthash "cur:d" "cursor:default;" tbl)
@@ -246,8 +269,11 @@
 (puthash "d" "display:${1:block};" tbl)
 (puthash "d:b" "display:block;" tbl)
 (puthash "d:cp" "display:compact;" tbl)
+(puthash "d:f" "display:flex;" tbl)
 (puthash "d:i" "display:inline;" tbl)
 (puthash "d:ib" "display:inline-block;" tbl)
+(puthash "d:ib+" "display: inline-block;\n*display: inline;\n*zoom: 1;" tbl)
+(puthash "d:if" "display:inline-flex;" tbl)
 (puthash "d:itb" "display:inline-table;" tbl)
 (puthash "d:li" "display:list-item;" tbl)
 (puthash "d:n" "display:none;" tbl)
@@ -287,16 +313,19 @@
 (puthash "fems:dt" "font-emphasize-style:dot;" tbl)
 (puthash "fems:n" "font-emphasize-style:none;" tbl)
 (puthash "ff" "font-family:|;" tbl)
+(puthash "ff:a" "font-family: Arial, \"Helvetica Neue\", Helvetica, sans-serif;" tbl)
 (puthash "ff:c" "font-family:cursive;" tbl)
 (puthash "ff:f" "font-family:fantasy;" tbl)
 (puthash "ff:m" "font-family:monospace;" tbl)
 (puthash "ff:s" "font-family:serif;" tbl)
 (puthash "ff:ss" "font-family:sans-serif;" tbl)
+(puthash "ff:t" "font-family: \"Times New Roman\", Times, Baskerville, Georgia, serif;" tbl)
+(puthash "ff:v" "font-family: Verdana, Geneva, sans-serif;" tbl)
 (puthash "fl" "float:${1:left};" tbl)
 (puthash "fl:l" "float:left;" tbl)
 (puthash "fl:n" "float:none;" tbl)
 (puthash "fl:r" "float:right;" tbl)
-(puthash "fs" "font-style:${1:italic};" tbl)
+(puthash "fs" "font-style:${italic};" tbl)
 (puthash "fs:i" "font-style:italic;" tbl)
 (puthash "fs:n" "font-style:normal;" tbl)
 (puthash "fs:o" "font-style:oblique;" tbl)
@@ -322,11 +351,31 @@
 (puthash "fw:br" "font-weight:bolder;" tbl)
 (puthash "fw:lr" "font-weight:lighter;" tbl)
 (puthash "fw:n" "font-weight:normal;" tbl)
+(puthash "fx" "flex:|;" tbl)
+(puthash "fxb" "flex-basis:|;" tbl)
+(puthash "fxd" "flex-direction:|;" tbl)
+(puthash "fxd:c" "flex-direction:column;" tbl)
+(puthash "fxd:cr" "flex-direction:column-reverse;" tbl)
+(puthash "fxd:r" "flex-direction:row;" tbl)
+(puthash "fxd:rr" "flex-direction:row-reverse;" tbl)
+(puthash "fxf" "flex-flow:|;" tbl)
+(puthash "fxg" "flex-grow:|;" tbl)
+(puthash "fxsh" "flex-shrink:|;" tbl)
+(puthash "fxw" "flex-wrap: |;" tbl)
+(puthash "fxw:n" "flex-wrap:nowrap;" tbl)
+(puthash "fxw:w" "flex-wrap:wrap;" tbl)
+(puthash "fxw:wr" "flex-wrap:wrap-reverse;" tbl)
 (puthash "fz" "font-size:|;" tbl)
 (puthash "fza" "font-size-adjust:|;" tbl)
 (puthash "fza:n" "font-size-adjust:none;" tbl)
 (puthash "h" "height:|;" tbl)
 (puthash "h:a" "height:auto;" tbl)
+(puthash "jc" "justify-content:|;" tbl)
+(puthash "jc:c" "justify-content:center;" tbl)
+(puthash "jc:fe" "justify-content:flex-end;" tbl)
+(puthash "jc:fs" "justify-content:flex-start;" tbl)
+(puthash "jc:sa" "justify-content:space-around;" tbl)
+(puthash "jc:sb" "justify-content:space-between;" tbl)
 (puthash "l" "left:|;" tbl)
 (puthash "l:a" "left:auto;" tbl)
 (puthash "lh" "line-height:|;" tbl)
@@ -347,6 +396,7 @@
 (puthash "list:s" "list-style-type:square;" tbl)
 (puthash "list:ur" "list-style-type:upper-roman;" tbl)
 (puthash "lts" "letter-spacing:|;" tbl)
+(puthash "lts-n" "letter-spacing:normal;" tbl)
 (puthash "m" "margin:|;" tbl)
 (puthash "m:a" "margin:auto;" tbl)
 (puthash "mah" "max-height:|;" tbl)
@@ -367,14 +417,28 @@
 (puthash "mt:a" "margin-top:auto;" tbl)
 (puthash "ol" "outline:|;" tbl)
 (puthash "ol:n" "outline:none;" tbl)
-(puthash "olc" "outline-color:${1:#000};" tbl)
+(puthash "olc" "outline-color:#${1:000};" tbl)
 (puthash "olc:i" "outline-color:invert;" tbl)
 (puthash "olo" "outline-offset:|;" tbl)
 (puthash "ols" "outline-style:|;" tbl)
+(puthash "ols:db" "outline-style:double;" tbl)
+(puthash "ols:ds" "outline-style:dashed;" tbl)
+(puthash "ols:dt" "outline-style:dotted;" tbl)
+(puthash "ols:g" "outline-style:groove;" tbl)
+(puthash "ols:i" "outline-style:inset;" tbl)
+(puthash "ols:n" "outline-style:none;" tbl)
+(puthash "ols:o" "outline-style:outset;" tbl)
+(puthash "ols:r" "outline-style:ridge;" tbl)
+(puthash "ols:s" "outline-style:solid;" tbl)
 (puthash "olw" "outline-width:|;" tbl)
+(puthash "olw:m" "outline-width:medium;" tbl)
+(puthash "olw:tc" "outline-width:thick;" tbl)
+(puthash "olw:tn" "outline-width:thin;" tbl)
 (puthash "op" "opacity:|;" tbl)
+(puthash "op+" "opacity: $1;\nfilter: alpha(opacity=$2);" tbl)
 (puthash "op:ie" "filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=100);" tbl)
 (puthash "op:ms" "-ms-filter:'progid:DXImageTransform.Microsoft.Alpha(Opacity=100)';" tbl)
+(puthash "ord" "order:|;" tbl)
 (puthash "ori" "orientation:|;" tbl)
 (puthash "ori:l" "orientation:landscape;" tbl)
 (puthash "ori:p" "orientation:portrait;" tbl)
@@ -480,21 +544,28 @@
 (puthash "to" "text-outline:|;" tbl)
 (puthash "to+" "text-outline:${1:0} ${2:0} ${3:#000};" tbl)
 (puthash "to:n" "text-outline:none;" tbl)
-(puthash "tov" "text-overflow:${1:ellipsis};" tbl)
+(puthash "tov" "text-overflow:${ellipsis};" tbl)
 (puthash "tov:c" "text-overflow:clip;" tbl)
 (puthash "tov:e" "text-overflow:ellipsis;" tbl)
 (puthash "tr" "text-replace:|;" tbl)
 (puthash "tr:n" "text-replace:none;" tbl)
 (puthash "trf" "transform:|;" tbl)
 (puthash "trf:r" "transform: rotate(${1:angle});" tbl)
+(puthash "trf:rx" "transform: rotateX(${1:angle});" tbl)
+(puthash "trf:ry" "transform: rotateY(${1:angle});" tbl)
+(puthash "trf:rz" "transform: rotateZ(${1:angle});" tbl)
 (puthash "trf:sc" "transform: scale(${1:x}, ${2:y});" tbl)
+(puthash "trf:sc3" "transform: scale3d(${1:x}, ${2:y}, ${3:z});" tbl)
 (puthash "trf:scx" "transform: scaleX(${1:x});" tbl)
 (puthash "trf:scy" "transform: scaleY(${1:y});" tbl)
+(puthash "trf:scz" "transform: scaleZ(${1:z});" tbl)
 (puthash "trf:skx" "transform: skewX(${1:angle});" tbl)
 (puthash "trf:sky" "transform: skewY(${1:angle});" tbl)
 (puthash "trf:t" "transform: translate(${1:x}, ${2:y});" tbl)
+(puthash "trf:t3" "transform: translate3d(${1:tx}, ${2:ty}, ${3:tz});" tbl)
 (puthash "trf:tx" "transform: translateX(${1:x});" tbl)
 (puthash "trf:ty" "transform: translateY(${1:y});" tbl)
+(puthash "trf:tz" "transform: translateZ(${1:z});" tbl)
 (puthash "trfo" "transform-origin:|;" tbl)
 (puthash "trfs" "transform-style:${1:preserve-3d};" tbl)
 (puthash "trs" "transition:${1:prop} ${2:time};" tbl)
@@ -517,7 +588,7 @@
 (puthash "tw:no" "text-wrap:none;" tbl)
 (puthash "tw:s" "text-wrap:suppress;" tbl)
 (puthash "tw:u" "text-wrap:unrestricted;" tbl)
-(puthash "us" "user-select:${1:none};" tbl)
+(puthash "us" "user-select:${none};" tbl)
 (puthash "v" "visibility:${1:hidden};" tbl)
 (puthash "v:c" "visibility:collapse;" tbl)
 (puthash "v:h" "visibility:hidden;" tbl)
@@ -533,7 +604,7 @@
 (puthash "va:tt" "vertical-align:text-top;" tbl)
 (puthash "w" "width:|;" tbl)
 (puthash "w:a" "width:auto;" tbl)
-(puthash "wfsm" "-webkit-font-smoothing:${1:antialiased};" tbl)
+(puthash "wfsm" "-webkit-font-smoothing:${antialiased};" tbl)
 (puthash "wfsm:a" "-webkit-font-smoothing:antialiased;" tbl)
 (puthash "wfsm:n" "-webkit-font-smoothing:none;" tbl)
 (puthash "wfsm:s" "-webkit-font-smoothing:subpixel-antialiased;" tbl)
@@ -551,14 +622,22 @@
 (puthash "whsc:l" "white-space-collapse:loose;" tbl)
 (puthash "whsc:n" "white-space-collapse:normal;" tbl)
 (puthash "wid" "widows:|;" tbl)
+(puthash "wm" "writing-mode:${1:lr-tb};" tbl)
+(puthash "wm:btl" "writing-mode:bt-lr;" tbl)
+(puthash "wm:btr" "writing-mode:bt-rl;" tbl)
+(puthash "wm:lrb" "writing-mode:lr-bt;" tbl)
+(puthash "wm:lrt" "writing-mode:lr-tb;" tbl)
+(puthash "wm:rlb" "writing-mode:rl-bt;" tbl)
+(puthash "wm:rlt" "writing-mode:rl-tb;" tbl)
+(puthash "wm:tbl" "writing-mode:tb-lr;" tbl)
+(puthash "wm:tbr" "writing-mode:tb-rl;" tbl)
 (puthash "wob" "word-break:|;" tbl)
 (puthash "wob:ba" "word-break:break-all;" tbl)
-(puthash "wob:bs" "word-break:break-strict;" tbl)
 (puthash "wob:k" "word-break:keep-all;" tbl)
-(puthash "wob:l" "word-break:loose;" tbl)
 (puthash "wob:n" "word-break:normal;" tbl)
 (puthash "wos" "word-spacing:|;" tbl)
 (puthash "wow" "word-wrap:|;" tbl)
+(puthash "wow:b" "word-wrap:break-word;" tbl)
 (puthash "wow:n" "word-wrap:none;" tbl)
 (puthash "wow:nm" "word-wrap:normal;" tbl)
 (puthash "wow:s" "word-wrap:suppress;" tbl)