CSS box-decoration-break property

CSS box-decoration-break

CSS box-decoration-break property is used to set how the elements fragments should be displayed, if the elements is separated into multiple blocks or fragments.

CSS box-decoration-break property values are

  • slice : When it is used the elements will looks like, as if it is not spitted or fragmented fully. The box created for each fragments may be different.
  • clone : When it is used each elements will be independently rendered with specific border, margin wrapping and padding.

To support box-decoration-break property on different browsers we need to add some prefixes, they are

  • -webkit- : It supports chrome, safari and new version of opera
  • -moz- : It support Firefox.
  • -o- : Old versions of opera.
  • -ms- : Internet explorer.

Example

Try Yourself

box-decoration-break is not supported in IE/Edge.