ant-design/components/divider/index.en-US.md
Pinaki Raj 218e1cea3d
feat: adding variant props to divider (#49654)
The divider border style can be either solid, dashed or
dotted based on the variant props. The default value is
solid.

Signed-off-by: Pinaki Raj <pinakiraj15@gmail.com>
2024-07-01 23:17:48 +08:00

2.0 KiB
Raw Blame History

category title description cover coverDark demo group
Components Divider A divider line separates different content. https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*7sMiTbzvaDoAAAAAAAAAAAAADrJ8AQ/original https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*KPSEQ74PLg4AAAAAAAAAAAAADrJ8AQ/original
cols
2
title order
Layout 2

When To Use

  • Divide sections of an article.
  • Divide inline text and links such as the operation column of table.

Examples

Horizontal Divider with title Text without heading style Vertical Style Customization Component Token Variant

API

Common props refCommon props

Property Description Type Default Version
children The wrapped title ReactNode -
className The className of container string -
dashed Whether line is dashed boolean false
variant Whether line is dashed, dotted or solid dashed | dotted | solid solid
orientation The position of title inside divider left | right | center center
orientationMargin The margin-left/right between the title and its closest border, while the orientation must be left or right, If a numeric value of type string is provided without a unit, it is assumed to be in pixels (px) by default. string | number -
plain Divider text show as plain style boolean true 4.2.0
style The style object of container CSSProperties -
type The direction type of divider horizontal | vertical horizontal

Design Token