CSS animated properties

  • Revision slug: CSS/CSS_animated_properties
  • Revision title: CSS animated properties
  • Revision id: 362537
  • Created:
  • Creator: teoli
  • Is current revision? No
  • Comment

Revision Content

{{draft()}}

{{Note("Please do not translate this page until it is done; it will be much easier at that point. The French translation is a test to be sure that it works well.")}}

This page lists all CSS properties and indicates if and how they are animatable.

Animations
Property Animatable
{{cssxref("animation")}} {{cssnotanimatabledef("animation")}}
{{cssxref("animation-delay")}} {{cssnotanimatabledef("animation-delay")}}
{{cssxref("animation-direction")}} {{cssnotanimatabledef("animation-direction")}}
 
{{cssxref("animation-duration")}} {{cssnotanimatabledef("animation-duration")}}
{{cssxref("animation-fill-mode")}} {{cssnotanimatabledef("animation-fill-mode")}}
{{cssxref("animation-iteration-count")}} {{cssnotanimatabledef("animation-iteration-count")}}
 
{{cssxref("animation-name")}} {{cssnotanimatabledef("animation-name")}}
 
{{cssxref("animation-play-state")}} {{cssnotanimatabledef("animation-play-state")}}
{{cssxref("animation-timing-function")}} {{cssnotanimatabledef("animation-timing-function")}}
Transitions
Property Animatable
{{cssxref("transition")}} {{cssnotanimatabledef("transition")}}
{{cssxref("transition-delay")}} {{cssnotanimatabledef("transition-delay")}}
{{cssxref("transition-duration")}} {{cssnotanimatabledef("transition-duration")}}
{{cssxref("transition-property")}} {{cssnotanimatabledef("transition-property")}}
{{cssxref("transition-timing-function")}} {{cssnotanimatabledef("transition-timing-function")}}
Transforms
Property Animatable
{{cssxref("transform")}} {{cssanimatabledef("transform", "transform")}}
{{cssxref("transform-origin")}} {{cssanimatabledef("transform-origin", "simplelist lpc")}}
{{cssxref("transform-style")}} {{cssnotanimatabledef("transform-style")}}
{{cssxref("perspective")}} {{cssanimatabledef("perspective", "length")}}
{{cssxref("perspective-origin")}} {{cssanimatabledef("perspective-origin", "simplelist lpc")}}
{{cssxref("backface-visibility")}} {{cssnotanimatabledef("backface-visibility")}}
Color
Property Animatable
{{cssxref("color")}} {{cssanimatabledef("color", "color")}}
{{cssxref("opacity")}} {{cssanimatabledef("opacity", "number")}}
Columns
Property Animatable
{{cssxref("columns")}} {{cssanimatableshorthand("columns", "column-width column-count")}}
{{cssxref("column-width")}} {{cssanimatabledef("column-width", "length")}}
{{cssxref("column-count")}} {{cssanimatabledef("column-count", "integer")}}
{{cssxref("column-gap")}} {{cssanimatabledef("column-gap", "length")}}
{{cssxref("column-rule")}} {{cssanimatableshorthand("column-rule", "column-rule-color column-rule-style column-rule-width")}}
{{cssxref("column-rule-color")}} {{cssanimatabledef("column-rule-color", "color")}}
{{cssxref("column-rule-style")}} {{cssnotanimatabledef("column-rule-style")}}
{{cssxref("column-rule-width")}} {{cssanimatabledef("column-rule-width", "length")}}
{{cssxref("break-before")}} {{cssnotanimatabledef("break-before")}}
{{cssxref("break-after")}} {{cssnotanimatabledef("break-after")}}
{{cssxref("break-inside")}} {{cssnotanimatabledef("break-inside")}}
{{cssxref("column-span")}} {{cssnotanimatabledef("column-span")}}
{{cssxref("column-fill")}} {{cssnotanimatabledef("column-fill")}}
Text
Property Animatable
{{cssxref("hyphens")}} {{cssnotanimatabledef("hyphens")}}
{{cssxref("letter-spacing")}} {{cssanimatabledef("letter-spacing", "length")}}
{{cssxref("word-wrap")}} {{cssnotanimatabledef("word-wrap")}}
{{cssxref("overflow-wrap")}} {{cssnotanimatabledef("overflow-wrap")}}
{{cssxref("text-transform")}} {{cssnotanimatabledef("text-transform")}}
{{cssxref("tab-size")}} {{cssnotanimatabledef("tab-size")}} (This may change before the specification reaches Candidate Recommendation)
{{cssxref("text-align")}} {{cssnotanimatabledef("text-align")}}
{{cssxref("text-align-last")}} {{cssnotanimatabledef("text-align-last")}}
{{cssxref("text-indent")}} {{cssanimatabledef("text-indent", "lpc")}}
{{cssxref("direction")}} {{cssnotanimatabledef("direction")}}
{{cssxref("white-space")}} {{cssnotanimatabledef("white-space")}}
{{cssxref("word-break")}} {{cssnotanimatabledef("word-break")}}
{{cssxref("word-spacing")}} {{cssanimatabledef("word-spacing", "length")}}
Text decorations
Property Animatable
{{cssxref("text-decoration")}} {{cssanimatableshorthand("text-decoration", "text-decoration-color text-decoration-style text-decoration-line")}}
{{cssxref("text-decoration-color")}} {{cssanimatabledef("text-decoration-color", "color")}}
{{cssxref("text-decoration-style")}} {{cssnotanimatabledef("text-decoration-style")}}
{{cssxref("text-decoration-line")}} {{cssnotanimatabledef("text-decoration-line")}}
{{cssxref("text-decoration-skip")}} {{cssnotanimatabledef("text-decoration-skip")}}
{{cssxref("text-underline-position")}} {{cssnotanimatabledef("text-underline-position")}}
Flexible boxes
Property Animatable
{{cssxref("align-content")}} {{cssnotanimatabledef("align-content")}}
{{cssxref("align-items")}} {{cssnotanimatabledef("align-items")}}
{{cssxref("align-self")}} {{cssnotanimatabledef("align-self")}}
{{cssxref("flex-basis")}} {{cssanimatabledef("flex-basis", "lpc")}}
{{cssxref("flex-direction")}} {{cssnotanimatabledef("flex-direction")}}
{{cssxref("flex-flow")}} {{cssnotanimatabledef("flex-flow")}}
{{cssxref("flex-grow")}} {{cssanimatabledef("flex-grow", "number", ', except between 0 and other values')}}
{{cssxref("flex-shrink")}} {{cssanimatabledef("flex-shrink", "number", ', except between 0 and other values')}}
{{cssxref("flex")}} {{cssanimatableshorthand("flex", "flex-grow flex-shrink flex-basis")}}
{{cssxref("flex-wrap")}} {{cssnotanimatabledef("flex-wrap")}}
{{cssxref("justify-content")}} {{cssnotanimatabledef("justify-content")}}
{{cssxref("order")}} {{cssanimatabledef("order", "integer")}}
Background & Borders
Property Animatable
{{cssxref("background")}} {{cssanimatableshorthand("background", "background-color background-image background-clip background-position background-size background-repeat background-attachment")}}
{{cssxref("background-attachment")}} {{cssnotanimatabledef("background-attachment")}}
{{cssxref("background-clip")}} {{cssnotanimatabledef("background-clip")}}
{{cssxref("background-color")}} {{cssanimatabledef("background-color", "color")}}
{{cssxref("background-image")}} {{cssnotanimatabledef("background-image")}}
{{cssxref("background-origin")}} {{cssnotanimatabledef("background-origin")}}
{{cssxref("background-position")}} {{cssanimatabledef("background-position", "repeatablelist simplelist lpc")}}
{{cssxref("background-repeat")}} {{cssnotanimatabledef("background-repeat")}}
{{cssxref("background-size")}} {{cssanimatabledef("background-size", "repeatablelist simplelist lpc", ". This means keyword values are not animatable.")}}
{{cssxref("border")}} {{cssanimatableshorthand("border", "border-color border-style border-width")}}
{{cssxref("border-bottom")}} {{cssanimatableshorthand("border-bottom", "border-bottom-color border-bottom-style border-bottom-width")}}
{{cssxref("border-bottom-color")}} {{cssanimatabledef("border-bottom-color", "color")}}
{{cssxref("border-bottom-left-radius")}} {{cssanimatabledef("border-bottom-left-radius", "lpc")}}
{{cssxref("border-bottom-right-radius")}} {{cssanimatabledef("border-bottom-right-radius", "lpc")}}
{{cssxref("border-bottom-style")}} {{cssnotanimatabledef("border-bottom-style")}}
{{cssxref("border-bottom-width")}} {{cssanimatabledef("border-bottom-width", "length")}}
{{cssxref("border-color")}} {{cssanimatableshorthand("border-color", "border-bottom-color border-left-color border-right-color border-top-color")}}
{{cssxref("border-image")}} {{cssnotanimatable("border-image")}}
{{cssxref("border-image-outset")}} {{cssnotanimatabledef("border-image-outset")}}
{{cssxref("border-image-repeat")}} {{cssnotanimatabledef("border-image-repeat")}}
{{cssxref("border-image-slice")}} {{cssnotanimatabledef("border-image-slice")}}
{{cssxref("border-image-source")}} {{cssnotanimatabledef("border-image-source")}}
{{cssxref("border-image-width")}} {{cssnotanimatabledef("border-image-width")}}
{{cssxref("border-left")}} {{cssanimatableshorthand("border-left", "border-left-color border-left-style border-left-width")}}
{{cssxref("border-left-color")}} {{cssanimatabledef("border-left-color", "color")}}
{{cssxref("border-left-style")}} {{cssnotanimatabledef("border-left-style")}}
{{cssxref("border-left-width")}} {{cssanimatabledef("border-left-width", "length")}}
{{cssxref("border-radius")}} {{cssanimatableshorthand("border-radius", "border-top-left-radius border-top-right-radius border-bottom-right-radius border-bottom-left-radius")}}
{{cssxref("border-right")}} {{cssanimatableshorthand("border-right", "border-right-color border-right-style border-right-width")}}
{{cssxref("border-right-color")}} {{cssanimatabledef("border-right-color", "color")}}
{{cssxref("border-right-style")}} {{cssnotanimatabledef("border-right-style")}}
{{cssxref("border-right-width")}} {{cssanimatabledef("border-right-width", "length")}}
{{cssxref("border-style")}} {{cssnotanimatabledef("border-style")}}
{{cssxref("border-top")}} {{cssanimatableshorthand("border-top", "border-top-color border-top-style border-top-width")}}
{{cssxref("border-top-color")}} {{cssanimatabledef("border-top-color", "color")}}
{{cssxref("border-top-left-radius")}} {{cssanimatabledef("border-top-left-radius", "lpc")}}
{{cssxref("border-top-right-radius")}} {{cssanimatabledef("border-top-right-radius", "lpc")}}
{{cssxref("border-top-style")}} {{cssnotanimatabledef("border-top-style")}}
{{cssxref("border-top-width")}} {{cssanimatabledef("border-top-width", "length")}}
{{cssxref("border-width")}} {{cssanimatableshorthand("border-width", "border-bottom-width border-left-width border-right-width border-top-width")}}
Box Model
Property Animatable
{{cssxref("box-decoration-break")}} {{cssnotanimatabledef("box-decoration-break")}}
{{cssxref("box-shadow")}} {{cssanimatabledef("box-shadow", "shadowlist")}}
{{cssxref("margin")}} {{cssanimatabledef("margin", "length")}}
{{cssxref("margin-bottom")}} {{cssanimatabledef("margin-bottom", "length")}}
{{cssxref("margin-left")}} {{cssanimatabledef("margin-left", "length")}}
{{cssxref("margin-right")}} {{cssanimatabledef("margin-right", "length")}}
{{cssxref("margin-top")}} {{cssanimatabledef("margin-top", "length")}}
{{cssxref("padding")}} {{cssanimatabledef("padding", "length")}}
{{cssxref("padding-bottom")}} {{cssanimatabledef("padding-bottom", "length")}}
{{cssxref("padding-left")}} {{cssanimatabledef("padding-left", "length")}}
{{cssxref("padding-right")}} {{cssanimatabledef("padding-right", "length")}}
{{cssxref("padding-top")}} {{cssanimatabledef("padding-top", "length")}}
{{cssxref("box-sizing")}} {{cssnotanimatabledef("box-sizing")}}
{{cssxref("max-height")}} {{cssanimatabledef("max-height", "lpc")}}
{{cssxref("min-height")}} {{cssanimatabledef("min-height", "lpc")}}
{{cssxref("height")}} {{cssanimatabledef("height", "lpc")}}
{{cssxref("max-width")}} {{cssanimatabledef("max-width", "lpc")}}
{{cssxref("min-width")}} {{cssanimatabledef("min-width", "lpc")}}
{{cssxref("width")}} {{cssanimatabledef("width", "lpc")}}
{{cssxref("overflow")}} {{cssnotanimatabledef("overflow")}}
{{cssxref("overflow-x")}} {{cssnotanimatabledef("overflow-x")}}
{{cssxref("overflow-y")}} {{cssnotanimatabledef("overflow-y")}}
{{cssxref("visibility")}} {{cssanimatabledef("visibility", "visibility")}}
Table
Property Animatable
{{cssxref("border-collapse")}} {{cssnotanimatabledef("border-collapse")}}
{{cssxref("border-spacing")}} {{cssnotanimatabledef("border-spacing")}}
{{cssxref("caption-side")}} {{cssnotanimatabledef("caption-side")}}
{{cssxref("empty-cells")}} {{cssnotanimatabledef("empty-cells")}}
{{cssxref("table-layout")}} {{cssnotanimatabledef("table-layout")}}
{{cssxref("vertical-align")}} {{cssanimatabledef("vertical-align", "length")}}
Positioning
Property Animatable
{{cssxref("bottom")}} {{cssanimatabledef("bottom", "lpc")}}
{{cssxref("left")}} {{cssanimatabledef("left", "lpc")}}
{{cssxref("right")}} {{cssanimatabledef("right", "lpc")}}
{{cssxref("top")}} {{cssanimatabledef("top", "lpc")}}
{{cssxref("float")}} {{cssnotanimatabledef("float")}}
{{cssxref("clear")}} {{cssnotanimatabledef("clear")}}
{{cssxref("position")}} {{cssnotanimatabledef("position")}}
{{cssxref("z-index")}} {{cssanimatabledef("z-index", "integer")}}
Fonts
Property Animatable
{{cssxref("font")}} {{cssanimatableshorthand("font", "font-style font-variant font-weight font-stretch font-size line-height font-family")}}
{{cssxref("font-family")}} {{cssnotanimatabledef("font-family")}}
{{cssxref("font-variant")}} {{cssnotanimatabledef("font-variant")}}
{{cssxref("font-weight")}} {{cssanimatabledef("font-weight", "font_weight")}}
{{cssxref("font-stretch")}} {{cssanimatabledef("font-stretch", "font_stretch")}}
{{cssxref("font-size")}} {{cssanimatabledef("font-size", "length")}}
{{cssxref("line-height")}} {{cssanimatabledef("line-height", "number length")}}
{{cssxref("font-feature-settings")}} {{cssnotanimatabledef("font-feature-settings")}}
{{cssxref("font-size-adjust")}} {{cssanimatabledef("font-size-adjust", "number")}}
{{cssxref("font-style")}} {{cssnotanimatabledef("font-style")}}
Images
Property Animatable
{{cssxref("image-rendering")}} {{cssnotanimatabledef("image-rendering")}}
{{cssxref("image-orientation")}} {{cssnotanimatabledef("image-orientation")}}
Counters & Lists
Property Animatable
{{cssxref("counter-increment")}} {{cssnotanimatabledef("counter-increment")}}
{{cssxref("counter-reset")}} {{cssnotanimatabledef("counter-reset")}}
{{cssxref("list-style")}} {{cssnotanimatabledef("list-style")}}
{{cssxref("list-style-image")}} {{cssnotanimatabledef("list-style-image")}}
{{cssxref("list-style-position")}} {{cssnotanimatabledef("list-style-position")}}
{{cssxref("list-style-type")}} {{cssnotanimatabledef("list-style-type")}}
Page
Property Animatable
{{cssxref("orphans")}} {{cssnotanimatabledef("orphans")}}
{{cssxref("page-break-after")}} {{cssnotanimatabledef("page-break-after")}}
{{cssxref("page-break-before")}} {{cssnotanimatabledef("page-break-before")}}
{{cssxref("page-break-inside")}} {{cssnotanimatabledef("page-break-inside")}}
{{cssxref("widows")}} {{cssnotanimatabledef("widows")}}
User interface
Property Animatable
{{cssxref("outline")}} {{cssanimatableshorthand("outline", "outline-color outline-width outline-style")}}
{{cssxref("outline-color")}} {{cssanimatabledef("outline-color", "color")}}
{{cssxref("outline-width")}} {{cssanimatabledef("outline-width", "length")}}
{{cssxref("outline-style")}} {{cssnotanimatabledef("outline-style")}}
{{cssxref("outline-offset")}} {{cssanimatabledef("outline-offset", "length")}}
{{cssxref("cursor")}} {{cssnotanimatabledef("cursor")}}
{{cssxref("resize")}} {{cssnotanimatabledef("resize")}}
{{cssxref("text-overflow")}} {{cssnotanimatabledef("text-overflow")}}
Generated content
Property Animatable
{{cssxref("content")}} {{cssnotanimatabledef("content")}}
{{cssxref("quotes")}} {{cssnotanimatabledef("quotes")}}
Miscellaneous
Property Animatable
{{cssxref("clip")}} {{cssanimatabledef("outline-offset", "rectangle")}}
{{cssxref("display")}} {{cssnotanimatabledef("display")}}
{{cssxref("unicode-bidi")}} {{cssnotanimatabledef("unicode-bidi")}}
{{cssxref("ime-mode")}} {{cssnotanimatabledef("ime-mode")}}

 

Revision Source

<p>{{draft()}}</p>
<p>{{Note("Please do not translate this page until it is done; it will be much easier at that point. The French translation is a test to be sure that it works well.")}}</p>
<p>This page lists all CSS properties and indicates if and how they are animatable.</p>
<table class="standard-table">
  <thead>
    <tr>
      <th colspan="2" scope="col">Animations</th>
    </tr>
    <tr>
      <th scope="col">Property</th>
      <th scope="col">Animatable</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>{{cssxref("animation")}}</td>
      <td>{{cssnotanimatabledef("animation")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("animation-delay")}}</td>
      <td>{{cssnotanimatabledef("animation-delay")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("animation-direction")}}</td>
      <td>{{cssnotanimatabledef("animation-direction")}}<br />
        &nbsp;</td>
    </tr>
    <tr>
      <td>{{cssxref("animation-duration")}}</td>
      <td>{{cssnotanimatabledef("animation-duration")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("animation-fill-mode")}}</td>
      <td>{{cssnotanimatabledef("animation-fill-mode")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("animation-iteration-count")}}</td>
      <td>{{cssnotanimatabledef("animation-iteration-count")}}<br />
        &nbsp;</td>
    </tr>
    <tr>
      <td>{{cssxref("animation-name")}}</td>
      <td>{{cssnotanimatabledef("animation-name")}}<br />
        &nbsp;</td>
    </tr>
    <tr>
      <td>{{cssxref("animation-play-state")}}</td>
      <td>{{cssnotanimatabledef("animation-play-state")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("animation-timing-function")}}</td>
      <td>{{cssnotanimatabledef("animation-timing-function")}}</td>
    </tr>
    <tr>
      <th colspan="2" scope="col">Transitions</th>
    </tr>
    <tr>
      <th scope="col">Property</th>
      <th scope="col">Animatable</th>
    </tr>
    <tr>
      <td>{{cssxref("transition")}}</td>
      <td>{{cssnotanimatabledef("transition")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("transition-delay")}}</td>
      <td>{{cssnotanimatabledef("transition-delay")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("transition-duration")}}</td>
      <td>{{cssnotanimatabledef("transition-duration")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("transition-property")}}</td>
      <td>{{cssnotanimatabledef("transition-property")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("transition-timing-function")}}</td>
      <td>{{cssnotanimatabledef("transition-timing-function")}}</td>
    </tr>
    <tr>
      <th colspan="2" scope="col">Transforms</th>
    </tr>
    <tr>
      <th scope="col">Property</th>
      <th scope="col">Animatable</th>
    </tr>
    <tr>
      <td>{{cssxref("transform")}}</td>
      <td>{{cssanimatabledef("transform", "transform")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("transform-origin")}}</td>
      <td>{{cssanimatabledef("transform-origin", "simplelist lpc")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("transform-style")}}</td>
      <td>{{cssnotanimatabledef("transform-style")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("perspective")}}</td>
      <td>{{cssanimatabledef("perspective", "length")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("perspective-origin")}}</td>
      <td>{{cssanimatabledef("perspective-origin", "simplelist lpc")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("backface-visibility")}}</td>
      <td>{{cssnotanimatabledef("backface-visibility")}}</td>
    </tr>
    <tr>
      <th colspan="2" scope="col">Color</th>
    </tr>
    <tr>
      <th scope="col">Property</th>
      <th scope="col">Animatable</th>
    </tr>
    <tr>
      <td>{{cssxref("color")}}</td>
      <td>{{cssanimatabledef("color", "color")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("opacity")}}</td>
      <td>{{cssanimatabledef("opacity", "number")}}</td>
    </tr>
    <tr>
      <th colspan="2" scope="col">Columns</th>
    </tr>
    <tr>
      <th scope="col">Property</th>
      <th scope="col">Animatable</th>
    </tr>
    <tr>
      <td>{{cssxref("columns")}}</td>
      <td>{{cssanimatableshorthand("columns", "column-width column-count")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("column-width")}}</td>
      <td>{{cssanimatabledef("column-width", "length")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("column-count")}}</td>
      <td>{{cssanimatabledef("column-count", "integer")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("column-gap")}}</td>
      <td id="syntax-column-gap">{{cssanimatabledef("column-gap", "length")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("column-rule")}}</td>
      <td id="syntax-column-rule">{{cssanimatableshorthand("column-rule", "column-rule-color column-rule-style column-rule-width")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("column-rule-color")}}</td>
      <td id="syntax-column-rule-color">{{cssanimatabledef("column-rule-color", "color")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("column-rule-style")}}</td>
      <td id="syntax-column-rule-style">{{cssnotanimatabledef("column-rule-style")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("column-rule-width")}}</td>
      <td id="syntax-column-rule-width">{{cssanimatabledef("column-rule-width", "length")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("break-before")}}</td>
      <td id="syntax-break-before">{{cssnotanimatabledef("break-before")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("break-after")}}</td>
      <td id="syntax-break-after">{{cssnotanimatabledef("break-after")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("break-inside")}}</td>
      <td id="syntax-break-inside">{{cssnotanimatabledef("break-inside")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("column-span")}}</td>
      <td id="syntax-column-span">{{cssnotanimatabledef("column-span")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("column-fill")}}</td>
      <td id="syntax-column-fill">{{cssnotanimatabledef("column-fill")}}</td>
    </tr>
    <tr>
      <th colspan="2" scope="col">Text</th>
    </tr>
    <tr>
      <th scope="col">Property</th>
      <th scope="col">Animatable</th>
    </tr>
    <tr>
      <td>{{cssxref("hyphens")}}</td>
      <td id="syntax-hyphens">{{cssnotanimatabledef("hyphens")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("letter-spacing")}}</td>
      <td>{{cssanimatabledef("letter-spacing", "length")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("word-wrap")}}</td>
      <td>{{cssnotanimatabledef("word-wrap")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("overflow-wrap")}}</td>
      <td>{{cssnotanimatabledef("overflow-wrap")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("text-transform")}}</td>
      <td>{{cssnotanimatabledef("text-transform")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("tab-size")}}</td>
      <td>{{cssnotanimatabledef("tab-size")}} (This may change before the specification reaches Candidate Recommendation)</td>
    </tr>
    <tr>
      <td>{{cssxref("text-align")}}</td>
      <td>{{cssnotanimatabledef("text-align")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("text-align-last")}}</td>
      <td>{{cssnotanimatabledef("text-align-last")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("text-indent")}}</td>
      <td>{{cssanimatabledef("text-indent", "lpc")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("direction")}}</td>
      <td>{{cssnotanimatabledef("direction")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("white-space")}}</td>
      <td>{{cssnotanimatabledef("white-space")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("word-break")}}</td>
      <td>{{cssnotanimatabledef("word-break")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("word-spacing")}}</td>
      <td>{{cssanimatabledef("word-spacing", "length")}}</td>
    </tr>
    <tr>
      <th colspan="2" scope="col">Text decorations</th>
    </tr>
    <tr>
      <th scope="col">Property</th>
      <th scope="col">Animatable</th>
    </tr>
    <tr>
      <td>{{cssxref("text-decoration")}}</td>
      <td>{{cssanimatableshorthand("text-decoration", "text-decoration-color text-decoration-style text-decoration-line")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("text-decoration-color")}}</td>
      <td>{{cssanimatabledef("text-decoration-color", "color")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("text-decoration-style")}}</td>
      <td>{{cssnotanimatabledef("text-decoration-style")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("text-decoration-line")}}</td>
      <td>{{cssnotanimatabledef("text-decoration-line")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("text-decoration-skip")}}</td>
      <td>{{cssnotanimatabledef("text-decoration-skip")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("text-underline-position")}}</td>
      <td>{{cssnotanimatabledef("text-underline-position")}}</td>
    </tr>
    <tr>
      <th colspan="2" scope="col">Flexible boxes</th>
    </tr>
    <tr>
      <th scope="col">Property</th>
      <th scope="col">Animatable</th>
    </tr>
    <tr>
      <td>{{cssxref("align-content")}}</td>
      <td>{{cssnotanimatabledef("align-content")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("align-items")}}</td>
      <td>{{cssnotanimatabledef("align-items")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("align-self")}}</td>
      <td>{{cssnotanimatabledef("align-self")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("flex-basis")}}</td>
      <td>{{cssanimatabledef("flex-basis", "lpc")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("flex-direction")}}</td>
      <td>{{cssnotanimatabledef("flex-direction")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("flex-flow")}}</td>
      <td>{{cssnotanimatabledef("flex-flow")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("flex-grow")}}</td>
      <td>{{cssanimatabledef("flex-grow", "number", ', except between <code class="css">0</code> and other values')}}</td>
    </tr>
    <tr>
      <td>{{cssxref("flex-shrink")}}</td>
      <td>{{cssanimatabledef("flex-shrink", "number", ', except between <code class="css">0</code> and other values')}}</td>
    </tr>
    <tr>
      <td>{{cssxref("flex")}}</td>
      <td>{{cssanimatableshorthand("flex", "flex-grow flex-shrink flex-basis")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("flex-wrap")}}</td>
      <td>{{cssnotanimatabledef("flex-wrap")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("justify-content")}}</td>
      <td>{{cssnotanimatabledef("justify-content")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("order")}}</td>
      <td>{{cssanimatabledef("order", "integer")}}</td>
    </tr>
    <tr>
      <th colspan="2" scope="col">Background &amp; Borders</th>
    </tr>
    <tr>
      <th scope="col">Property</th>
      <th scope="col">Animatable</th>
    </tr>
    <tr>
      <td>{{cssxref("background")}}</td>
      <td>{{cssanimatableshorthand("background", "background-color background-image background-clip background-position background-size background-repeat background-attachment")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("background-attachment")}}</td>
      <td>{{cssnotanimatabledef("background-attachment")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("background-clip")}}</td>
      <td>{{cssnotanimatabledef("background-clip")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("background-color")}}</td>
      <td>{{cssanimatabledef("background-color", "color")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("background-image")}}</td>
      <td>{{cssnotanimatabledef("background-image")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("background-origin")}}</td>
      <td>{{cssnotanimatabledef("background-origin")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("background-position")}}</td>
      <td>{{cssanimatabledef("background-position", "repeatablelist simplelist lpc")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("background-repeat")}}</td>
      <td>{{cssnotanimatabledef("background-repeat")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("background-size")}}</td>
      <td>{{cssanimatabledef("background-size", "repeatablelist simplelist lpc", ". This means keyword values are not animatable.")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border")}}</td>
      <td>{{cssanimatableshorthand("border", "border-color border-style border-width")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-bottom")}}</td>
      <td>{{cssanimatableshorthand("border-bottom", "border-bottom-color border-bottom-style border-bottom-width")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-bottom-color")}}</td>
      <td>{{cssanimatabledef("border-bottom-color", "color")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-bottom-left-radius")}}</td>
      <td>{{cssanimatabledef("border-bottom-left-radius", "lpc")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-bottom-right-radius")}}</td>
      <td>{{cssanimatabledef("border-bottom-right-radius", "lpc")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-bottom-style")}}</td>
      <td>{{cssnotanimatabledef("border-bottom-style")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-bottom-width")}}</td>
      <td>{{cssanimatabledef("border-bottom-width", "length")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-color")}}</td>
      <td>{{cssanimatableshorthand("border-color", "border-bottom-color border-left-color border-right-color border-top-color")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-image")}}</td>
      <td>{{cssnotanimatable("border-image")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-image-outset")}}</td>
      <td>{{cssnotanimatabledef("border-image-outset")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-image-repeat")}}</td>
      <td>{{cssnotanimatabledef("border-image-repeat")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-image-slice")}}</td>
      <td>{{cssnotanimatabledef("border-image-slice")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-image-source")}}</td>
      <td>{{cssnotanimatabledef("border-image-source")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-image-width")}}</td>
      <td>{{cssnotanimatabledef("border-image-width")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-left")}}</td>
      <td>{{cssanimatableshorthand("border-left", "border-left-color border-left-style border-left-width")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-left-color")}}</td>
      <td>{{cssanimatabledef("border-left-color", "color")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-left-style")}}</td>
      <td>{{cssnotanimatabledef("border-left-style")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-left-width")}}</td>
      <td>{{cssanimatabledef("border-left-width", "length")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-radius")}}</td>
      <td>{{cssanimatableshorthand("border-radius", "border-top-left-radius border-top-right-radius border-bottom-right-radius border-bottom-left-radius")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-right")}}</td>
      <td>{{cssanimatableshorthand("border-right", "border-right-color border-right-style border-right-width")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-right-color")}}</td>
      <td>{{cssanimatabledef("border-right-color", "color")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-right-style")}}</td>
      <td>{{cssnotanimatabledef("border-right-style")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-right-width")}}</td>
      <td>{{cssanimatabledef("border-right-width", "length")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-style")}}</td>
      <td>{{cssnotanimatabledef("border-style")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-top")}}</td>
      <td>{{cssanimatableshorthand("border-top", "border-top-color border-top-style border-top-width")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-top-color")}}</td>
      <td>{{cssanimatabledef("border-top-color", "color")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-top-left-radius")}}</td>
      <td>{{cssanimatabledef("border-top-left-radius", "lpc")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-top-right-radius")}}</td>
      <td>{{cssanimatabledef("border-top-right-radius", "lpc")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-top-style")}}</td>
      <td>{{cssnotanimatabledef("border-top-style")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-top-width")}}</td>
      <td>{{cssanimatabledef("border-top-width", "length")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-width")}}</td>
      <td>{{cssanimatableshorthand("border-width", "border-bottom-width border-left-width border-right-width border-top-width")}}</td>
    </tr>
    <tr>
      <th colspan="2" scope="col">Box Model</th>
    </tr>
    <tr>
      <th scope="col">Property</th>
      <th scope="col">Animatable</th>
    </tr>
    <tr>
      <td>{{cssxref("box-decoration-break")}}</td>
      <td>{{cssnotanimatabledef("box-decoration-break")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("box-shadow")}}</td>
      <td>{{cssanimatabledef("box-shadow", "shadowlist")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("margin")}}</td>
      <td>{{cssanimatabledef("margin", "length")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("margin-bottom")}}</td>
      <td>{{cssanimatabledef("margin-bottom", "length")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("margin-left")}}</td>
      <td>{{cssanimatabledef("margin-left", "length")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("margin-right")}}</td>
      <td>{{cssanimatabledef("margin-right", "length")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("margin-top")}}</td>
      <td>{{cssanimatabledef("margin-top", "length")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("padding")}}</td>
      <td>{{cssanimatabledef("padding", "length")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("padding-bottom")}}</td>
      <td>{{cssanimatabledef("padding-bottom", "length")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("padding-left")}}</td>
      <td>{{cssanimatabledef("padding-left", "length")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("padding-right")}}</td>
      <td>{{cssanimatabledef("padding-right", "length")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("padding-top")}}</td>
      <td>{{cssanimatabledef("padding-top", "length")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("box-sizing")}}</td>
      <td>{{cssnotanimatabledef("box-sizing")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("max-height")}}</td>
      <td>{{cssanimatabledef("max-height", "lpc")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("min-height")}}</td>
      <td>{{cssanimatabledef("min-height", "lpc")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("height")}}</td>
      <td>{{cssanimatabledef("height", "lpc")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("max-width")}}</td>
      <td>{{cssanimatabledef("max-width", "lpc")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("min-width")}}</td>
      <td>{{cssanimatabledef("min-width", "lpc")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("width")}}</td>
      <td>{{cssanimatabledef("width", "lpc")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("overflow")}}</td>
      <td>{{cssnotanimatabledef("overflow")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("overflow-x")}}</td>
      <td>{{cssnotanimatabledef("overflow-x")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("overflow-y")}}</td>
      <td>{{cssnotanimatabledef("overflow-y")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("visibility")}}</td>
      <td>{{cssanimatabledef("visibility", "visibility")}}</td>
    </tr>
    <tr>
      <th colspan="2" scope="col">Table</th>
    </tr>
    <tr>
      <th scope="col">Property</th>
      <th scope="col">Animatable</th>
    </tr>
    <tr>
      <td>{{cssxref("border-collapse")}}</td>
      <td>{{cssnotanimatabledef("border-collapse")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("border-spacing")}}</td>
      <td>{{cssnotanimatabledef("border-spacing")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("caption-side")}}</td>
      <td>{{cssnotanimatabledef("caption-side")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("empty-cells")}}</td>
      <td>{{cssnotanimatabledef("empty-cells")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("table-layout")}}</td>
      <td>{{cssnotanimatabledef("table-layout")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("vertical-align")}}</td>
      <td>{{cssanimatabledef("vertical-align", "length")}}</td>
    </tr>
    <tr>
      <th colspan="2" scope="col">Positioning</th>
    </tr>
    <tr>
      <th scope="col">Property</th>
      <th scope="col">Animatable</th>
    </tr>
    <tr>
      <td>{{cssxref("bottom")}}</td>
      <td>{{cssanimatabledef("bottom", "lpc")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("left")}}</td>
      <td>{{cssanimatabledef("left", "lpc")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("right")}}</td>
      <td>{{cssanimatabledef("right", "lpc")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("top")}}</td>
      <td>{{cssanimatabledef("top", "lpc")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("float")}}</td>
      <td>{{cssnotanimatabledef("float")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("clear")}}</td>
      <td>{{cssnotanimatabledef("clear")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("position")}}</td>
      <td>{{cssnotanimatabledef("position")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("z-index")}}</td>
      <td>{{cssanimatabledef("z-index", "integer")}}</td>
    </tr>
    <tr>
      <th colspan="2" scope="col">Fonts</th>
    </tr>
    <tr>
      <th scope="col">Property</th>
      <th scope="col">Animatable</th>
    </tr>
    <tr>
      <td>{{cssxref("font")}}</td>
      <td>{{cssanimatableshorthand("font", "font-style font-variant font-weight font-stretch font-size line-height font-family")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("font-family")}}</td>
      <td>{{cssnotanimatabledef("font-family")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("font-variant")}}</td>
      <td>{{cssnotanimatabledef("font-variant")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("font-weight")}}</td>
      <td>{{cssanimatabledef("font-weight", "font_weight")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("font-stretch")}}</td>
      <td>{{cssanimatabledef("font-stretch", "font_stretch")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("font-size")}}</td>
      <td>{{cssanimatabledef("font-size", "length")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("line-height")}}</td>
      <td>{{cssanimatabledef("line-height", "number length")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("font-feature-settings")}}</td>
      <td>{{cssnotanimatabledef("font-feature-settings")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("font-size-adjust")}}</td>
      <td>{{cssanimatabledef("font-size-adjust", "number")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("font-style")}}</td>
      <td>{{cssnotanimatabledef("font-style")}}</td>
    </tr>
    <tr>
      <th colspan="2" scope="col">Images</th>
    </tr>
    <tr>
      <th scope="col">Property</th>
      <th scope="col">Animatable</th>
    </tr>
    <tr>
      <td>{{cssxref("image-rendering")}}</td>
      <td>{{cssnotanimatabledef("image-rendering")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("image-orientation")}}</td>
      <td>{{cssnotanimatabledef("image-orientation")}}</td>
    </tr>
    <tr>
      <th colspan="2" scope="col">Counters &amp; Lists</th>
    </tr>
    <tr>
      <th scope="col">Property</th>
      <th scope="col">Animatable</th>
    </tr>
    <tr>
      <td>{{cssxref("counter-increment")}}</td>
      <td>{{cssnotanimatabledef("counter-increment")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("counter-reset")}}</td>
      <td>{{cssnotanimatabledef("counter-reset")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("list-style")}}</td>
      <td>{{cssnotanimatabledef("list-style")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("list-style-image")}}</td>
      <td>{{cssnotanimatabledef("list-style-image")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("list-style-position")}}</td>
      <td>{{cssnotanimatabledef("list-style-position")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("list-style-type")}}</td>
      <td>{{cssnotanimatabledef("list-style-type")}}</td>
    </tr>
    <tr>
      <th colspan="2" scope="col">Page</th>
    </tr>
    <tr>
      <th scope="col">Property</th>
      <th scope="col">Animatable</th>
    </tr>
    <tr>
      <td>{{cssxref("orphans")}}</td>
      <td>{{cssnotanimatabledef("orphans")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("page-break-after")}}</td>
      <td>{{cssnotanimatabledef("page-break-after")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("page-break-before")}}</td>
      <td>{{cssnotanimatabledef("page-break-before")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("page-break-inside")}}</td>
      <td>{{cssnotanimatabledef("page-break-inside")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("widows")}}</td>
      <td>{{cssnotanimatabledef("widows")}}</td>
    </tr>
    <tr>
      <th colspan="2" scope="col">User interface</th>
    </tr>
    <tr>
      <th scope="col">Property</th>
      <th scope="col">Animatable</th>
    </tr>
    <tr>
      <td>{{cssxref("outline")}}</td>
      <td>{{cssanimatableshorthand("outline", "outline-color outline-width outline-style")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("outline-color")}}</td>
      <td>{{cssanimatabledef("outline-color", "color")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("outline-width")}}</td>
      <td>{{cssanimatabledef("outline-width", "length")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("outline-style")}}</td>
      <td>{{cssnotanimatabledef("outline-style")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("outline-offset")}}</td>
      <td>{{cssanimatabledef("outline-offset", "length")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("cursor")}}</td>
      <td>{{cssnotanimatabledef("cursor")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("resize")}}</td>
      <td>{{cssnotanimatabledef("resize")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("text-overflow")}}</td>
      <td>{{cssnotanimatabledef("text-overflow")}}</td>
    </tr>
    <tr>
      <th colspan="2" scope="col">Generated content</th>
    </tr>
    <tr>
      <th scope="col">Property</th>
      <th scope="col">Animatable</th>
    </tr>
    <tr>
      <td>{{cssxref("content")}}</td>
      <td>{{cssnotanimatabledef("content")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("quotes")}}</td>
      <td>{{cssnotanimatabledef("quotes")}}</td>
    </tr>
    <tr>
      <th colspan="2" scope="col">Miscellaneous</th>
    </tr>
    <tr>
      <th scope="col">Property</th>
      <th scope="col">Animatable</th>
    </tr>
    <tr>
      <td>{{cssxref("clip")}}</td>
      <td>{{cssanimatabledef("outline-offset", "rectangle")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("display")}}</td>
      <td>{{cssnotanimatabledef("display")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("unicode-bidi")}}</td>
      <td>{{cssnotanimatabledef("unicode-bidi")}}</td>
    </tr>
    <tr>
      <td>{{cssxref("ime-mode")}}</td>
      <td>{{cssnotanimatabledef("ime-mode")}}</td>
    </tr>
  </tbody>
</table>
<p>&nbsp;</p>
Revert to this revision