PavelGonzales/css-triggers

CSS properties that trigger composition, paint, or layout

Composite

The easiest step

• cursor
• font-variant
• opacity
• orphans
• perspective
• perspective-origin
• pointer-events
• transform
• widows

Paint

Step heavier

• background-attachment
• background-blend-mode
• background-clip
• background-color
• background-image
• background-origin
• background-position
• background-repeat
• background-size
• border-bottom-color
• border-bottom-left-radius
• border-bottom-right-radius
• border-bottom-style
• border-image-outset
• border-image-repeat
• border-image-slice
• border-image-source
• border-image-width
• border-left-color
• border-left-style
• border-right-color
• border-right-style
• border-top-color
• border-top-left-radius
• border-top-right-radius
• border-top-style
• clip
• color
• resize
• text-decoration
• transform-origin
• z-index

Layout

Well, this should be avoided

• align-content
• align-items
• align-self
• border-bottom-width
• border-left-width
• border-right-width
• border-top-width
• bottom
• box-shadow
• box-sizing
• clear
• display
• flex-basis
• flex-direction
• flex-grow
• flex-shrink
• flex-wrap
• float
• font-family
• font-kerning
• font-size
• font-style
• font-variant-ligatures
• font-weight
• height
• justify-content
• left
• letter-spacing
• line-height
• list-style-image
• list-style-position
• list-style-type
• margin-bottom
• margin-left
• margin-right
• margin-top
• max-height
• max-width
• min-height
• min-width
• order
• outline-color
• outline-offset
• outline-style
• outline-width
• overflow-x
• overflow-y
• padding-bottom
• padding-left
• padding-right
• padding-top
• position
• right
• text-align
• text-indent
• text-rendering
• text-shadow
• text-transform
• top
• unicode-bidi
• vertical-align
• visibility
• white-space
• width
• word-break
• word-spacing