Skip to main content
Updated list as of WP 6.2
Source Link
Matthew Boynes
  • 7.1k
  • 2
  • 23
  • 36

WordPress will check the styles against a list of allowed properties and it will still strip the style attribute if none of the styles are safe. The default allow list (as of WordPress 6.2) is:

  • text-align
  • margin
  • color
  • float
  • border
  • background
  • background-color
  • border-bottom
  • border-bottom-color
  • border-bottom-style
  • border-bottom-width
  • border-collapse
  • border-color
  • border-left
  • border-left-color
  • border-left-style
  • border-left-width
  • border-right
  • border-right-color
  • border-right-style
  • border-right-width
  • border-spacing
  • border-style
  • border-top
  • border-top-color
  • border-top-style
  • border-top-width
  • border-width
  • caption-side
  • clear
  • cursor
  • direction
  • font
  • font-family
  • font-size
  • font-style
  • font-variant
  • font-weight
  • height
  • letter-spacing
  • line-height
  • margin-bottom
  • margin-left
  • margin-right
  • margin-top
  • overflow
  • padding
  • padding-bottom
  • padding-left
  • padding-right
  • padding-top
  • text-decoration
  • text-indent
  • vertical-align
  • width
array(
    'background',
    'background-color',
    'background-image',
    'background-position',
    'background-size',
    'background-attachment',
    'background-blend-mode',

    'border',
    'border-radius',
    'border-width',
    'border-color',
    'border-style',
    'border-right',
    'border-right-color',
    'border-right-style',
    'border-right-width',
    'border-bottom',
    'border-bottom-color',
    'border-bottom-left-radius',
    'border-bottom-right-radius',
    'border-bottom-style',
    'border-bottom-width',
    'border-bottom-right-radius',
    'border-bottom-left-radius',
    'border-left',
    'border-left-color',
    'border-left-style',
    'border-left-width',
    'border-top',
    'border-top-color',
    'border-top-left-radius',
    'border-top-right-radius',
    'border-top-style',
    'border-top-width',
    'border-top-left-radius',
    'border-top-right-radius',

    'border-spacing',
    'border-collapse',
    'caption-side',

    'columns',
    'column-count',
    'column-fill',
    'column-gap',
    'column-rule',
    'column-span',
    'column-width',

    'color',
    'filter',
    'font',
    'font-family',
    'font-size',
    'font-style',
    'font-variant',
    'font-weight',
    'letter-spacing',
    'line-height',
    'text-align',
    'text-decoration',
    'text-indent',
    'text-transform',

    'height',
    'min-height',
    'max-height',

    'width',
    'min-width',
    'max-width',

    'margin',
    'margin-right',
    'margin-bottom',
    'margin-left',
    'margin-top',
    'margin-block-start',
    'margin-block-end',
    'margin-inline-start',
    'margin-inline-end',

    'padding',
    'padding-right',
    'padding-bottom',
    'padding-left',
    'padding-top',
    'padding-block-start',
    'padding-block-end',
    'padding-inline-start',
    'padding-inline-end',

    'flex',
    'flex-basis',
    'flex-direction',
    'flex-flow',
    'flex-grow',
    'flex-shrink',
    'flex-wrap',

    'gap',
    'column-gap',
    'row-gap',

    'grid-template-columns',
    'grid-auto-columns',
    'grid-column-start',
    'grid-column-end',
    'grid-column-gap',
    'grid-template-rows',
    'grid-auto-rows',
    'grid-row-start',
    'grid-row-end',
    'grid-row-gap',
    'grid-gap',

    'justify-content',
    'justify-items',
    'justify-self',
    'align-content',
    'align-items',
    'align-self',

    'clear',
    'cursor',
    'direction',
    'float',
    'list-style-type',
    'object-fit',
    'object-position',
    'overflow',
    'vertical-align',

    'position',
    'top',
    'right',
    'bottom',
    'left',
    'z-index',
    'aspect-ratio',

    // Custom CSS properties.
    '--*',
)

WordPress will check the styles against a list of allowed properties and it will still strip the style attribute if none of the styles are safe. The default allow list is:

  • text-align
  • margin
  • color
  • float
  • border
  • background
  • background-color
  • border-bottom
  • border-bottom-color
  • border-bottom-style
  • border-bottom-width
  • border-collapse
  • border-color
  • border-left
  • border-left-color
  • border-left-style
  • border-left-width
  • border-right
  • border-right-color
  • border-right-style
  • border-right-width
  • border-spacing
  • border-style
  • border-top
  • border-top-color
  • border-top-style
  • border-top-width
  • border-width
  • caption-side
  • clear
  • cursor
  • direction
  • font
  • font-family
  • font-size
  • font-style
  • font-variant
  • font-weight
  • height
  • letter-spacing
  • line-height
  • margin-bottom
  • margin-left
  • margin-right
  • margin-top
  • overflow
  • padding
  • padding-bottom
  • padding-left
  • padding-right
  • padding-top
  • text-decoration
  • text-indent
  • vertical-align
  • width

WordPress will check the styles against a list of allowed properties and it will still strip the style attribute if none of the styles are safe. The default allow list (as of WordPress 6.2) is:

array(
    'background',
    'background-color',
    'background-image',
    'background-position',
    'background-size',
    'background-attachment',
    'background-blend-mode',

    'border',
    'border-radius',
    'border-width',
    'border-color',
    'border-style',
    'border-right',
    'border-right-color',
    'border-right-style',
    'border-right-width',
    'border-bottom',
    'border-bottom-color',
    'border-bottom-left-radius',
    'border-bottom-right-radius',
    'border-bottom-style',
    'border-bottom-width',
    'border-bottom-right-radius',
    'border-bottom-left-radius',
    'border-left',
    'border-left-color',
    'border-left-style',
    'border-left-width',
    'border-top',
    'border-top-color',
    'border-top-left-radius',
    'border-top-right-radius',
    'border-top-style',
    'border-top-width',
    'border-top-left-radius',
    'border-top-right-radius',

    'border-spacing',
    'border-collapse',
    'caption-side',

    'columns',
    'column-count',
    'column-fill',
    'column-gap',
    'column-rule',
    'column-span',
    'column-width',

    'color',
    'filter',
    'font',
    'font-family',
    'font-size',
    'font-style',
    'font-variant',
    'font-weight',
    'letter-spacing',
    'line-height',
    'text-align',
    'text-decoration',
    'text-indent',
    'text-transform',

    'height',
    'min-height',
    'max-height',

    'width',
    'min-width',
    'max-width',

    'margin',
    'margin-right',
    'margin-bottom',
    'margin-left',
    'margin-top',
    'margin-block-start',
    'margin-block-end',
    'margin-inline-start',
    'margin-inline-end',

    'padding',
    'padding-right',
    'padding-bottom',
    'padding-left',
    'padding-top',
    'padding-block-start',
    'padding-block-end',
    'padding-inline-start',
    'padding-inline-end',

    'flex',
    'flex-basis',
    'flex-direction',
    'flex-flow',
    'flex-grow',
    'flex-shrink',
    'flex-wrap',

    'gap',
    'column-gap',
    'row-gap',

    'grid-template-columns',
    'grid-auto-columns',
    'grid-column-start',
    'grid-column-end',
    'grid-column-gap',
    'grid-template-rows',
    'grid-auto-rows',
    'grid-row-start',
    'grid-row-end',
    'grid-row-gap',
    'grid-gap',

    'justify-content',
    'justify-items',
    'justify-self',
    'align-content',
    'align-items',
    'align-self',

    'clear',
    'cursor',
    'direction',
    'float',
    'list-style-type',
    'object-fit',
    'object-position',
    'overflow',
    'vertical-align',

    'position',
    'top',
    'right',
    'bottom',
    'left',
    'z-index',
    'aspect-ratio',

    // Custom CSS properties.
    '--*',
)
change whitelist to allow list
Source Link
Brooke.
  • 3.9k
  • 1
  • 26
  • 34

This is an older question, but here's the answer for future generations:

WordPress will check the styles against a whitelistlist of allowed properties and it will still strip the style attribute if none of the styles are safe. The default whitelistallow list is:

  • text-align
  • margin
  • color
  • float
  • border
  • background
  • background-color
  • border-bottom
  • border-bottom-color
  • border-bottom-style
  • border-bottom-width
  • border-collapse
  • border-color
  • border-left
  • border-left-color
  • border-left-style
  • border-left-width
  • border-right
  • border-right-color
  • border-right-style
  • border-right-width
  • border-spacing
  • border-style
  • border-top
  • border-top-color
  • border-top-style
  • border-top-width
  • border-width
  • caption-side
  • clear
  • cursor
  • direction
  • font
  • font-family
  • font-size
  • font-style
  • font-variant
  • font-weight
  • height
  • letter-spacing
  • line-height
  • margin-bottom
  • margin-left
  • margin-right
  • margin-top
  • overflow
  • padding
  • padding-bottom
  • padding-left
  • padding-right
  • padding-top
  • text-decoration
  • text-indent
  • vertical-align
  • width

This list is, as with most things in WordPress, filtered! You can add display to it as follows to let your code work as expected:

add_filter( 'safe_style_css', function( $styles ) {
    $styles[] = 'display';
    return $styles;
} );

This is an older question, but here's the answer for future generations:

WordPress will check the styles against a whitelist and it will still strip the style attribute if none of the styles are safe. The default whitelist is:

  • text-align
  • margin
  • color
  • float
  • border
  • background
  • background-color
  • border-bottom
  • border-bottom-color
  • border-bottom-style
  • border-bottom-width
  • border-collapse
  • border-color
  • border-left
  • border-left-color
  • border-left-style
  • border-left-width
  • border-right
  • border-right-color
  • border-right-style
  • border-right-width
  • border-spacing
  • border-style
  • border-top
  • border-top-color
  • border-top-style
  • border-top-width
  • border-width
  • caption-side
  • clear
  • cursor
  • direction
  • font
  • font-family
  • font-size
  • font-style
  • font-variant
  • font-weight
  • height
  • letter-spacing
  • line-height
  • margin-bottom
  • margin-left
  • margin-right
  • margin-top
  • overflow
  • padding
  • padding-bottom
  • padding-left
  • padding-right
  • padding-top
  • text-decoration
  • text-indent
  • vertical-align
  • width

This list is, as with most things in WordPress, filtered! You can add display to it as follows to let your code work as expected:

add_filter( 'safe_style_css', function( $styles ) {
    $styles[] = 'display';
    return $styles;
} );

This is an older question, but here's the answer for future generations:

WordPress will check the styles against a list of allowed properties and it will still strip the style attribute if none of the styles are safe. The default allow list is:

  • text-align
  • margin
  • color
  • float
  • border
  • background
  • background-color
  • border-bottom
  • border-bottom-color
  • border-bottom-style
  • border-bottom-width
  • border-collapse
  • border-color
  • border-left
  • border-left-color
  • border-left-style
  • border-left-width
  • border-right
  • border-right-color
  • border-right-style
  • border-right-width
  • border-spacing
  • border-style
  • border-top
  • border-top-color
  • border-top-style
  • border-top-width
  • border-width
  • caption-side
  • clear
  • cursor
  • direction
  • font
  • font-family
  • font-size
  • font-style
  • font-variant
  • font-weight
  • height
  • letter-spacing
  • line-height
  • margin-bottom
  • margin-left
  • margin-right
  • margin-top
  • overflow
  • padding
  • padding-bottom
  • padding-left
  • padding-right
  • padding-top
  • text-decoration
  • text-indent
  • vertical-align
  • width

This list is, as with most things in WordPress, filtered! You can add display to it as follows to let your code work as expected:

add_filter( 'safe_style_css', function( $styles ) {
    $styles[] = 'display';
    return $styles;
} );
Source Link
Matthew Boynes
  • 7.1k
  • 2
  • 23
  • 36

This is an older question, but here's the answer for future generations:

WordPress will check the styles against a whitelist and it will still strip the style attribute if none of the styles are safe. The default whitelist is:

  • text-align
  • margin
  • color
  • float
  • border
  • background
  • background-color
  • border-bottom
  • border-bottom-color
  • border-bottom-style
  • border-bottom-width
  • border-collapse
  • border-color
  • border-left
  • border-left-color
  • border-left-style
  • border-left-width
  • border-right
  • border-right-color
  • border-right-style
  • border-right-width
  • border-spacing
  • border-style
  • border-top
  • border-top-color
  • border-top-style
  • border-top-width
  • border-width
  • caption-side
  • clear
  • cursor
  • direction
  • font
  • font-family
  • font-size
  • font-style
  • font-variant
  • font-weight
  • height
  • letter-spacing
  • line-height
  • margin-bottom
  • margin-left
  • margin-right
  • margin-top
  • overflow
  • padding
  • padding-bottom
  • padding-left
  • padding-right
  • padding-top
  • text-decoration
  • text-indent
  • vertical-align
  • width

This list is, as with most things in WordPress, filtered! You can add display to it as follows to let your code work as expected:

add_filter( 'safe_style_css', function( $styles ) {
    $styles[] = 'display';
    return $styles;
} );