column-rule
The column-rule property is shorthand for all column rule properties.
Formal Syntax
<gap-rule-list> | <gap-auto-rule-list>JavaScript Access
// Access via element.style
element.style.columnRule = 'value';
Browser Support
| Feature | Chrome | Firefox | Safari | Edge |
|---|---|---|---|---|
| column-rule | 50 | 52 | 9 | 12 |
| dashed | 1 | 3.5 | 3 | 12 |
| dotted | 1 | 3.5 | 3 | 12 |
| double | 1 | 3.5 | 3 | 12 |
| groove | 1 | 3.5 | 3 | 12 |
| hidden | 1 | 3.5 | 3 | 12 |
| inset | 1 | 3.5 | 3 | 12 |
| medium | 1 | 3.5 | 3 | 12 |
| none | 1 | 3.5 | 3 | 12 |
| outset | 1 | 3.5 | 3 | 12 |
| ridge | 1 | 3.5 | 3 | 12 |
| solid | 1 | 3.5 | 3 | 12 |
| thick | 1 | 3.5 | 3 | 12 |
| thin | 1 | 3.5 | 3 | 12 |
| transparent | 1 | 3.5 | 3 | 12 |
Related Properties
- align-content
- align-items
- align-self
- anchor-name
- anchor-scope
- break-after
- break-before
- break-inside
- caption-side
- clear
- column-count
- column-fill
- column-gap
- column-rule-color
- column-rule-style
- column-rule-width
- column-span
- column-width
- columns
- contain
- container
- container-name
- container-type
- content
- content-visibility
- display
- empty-cells
- flex
- flex-basis
- flex-direction
- flex-flow
- flex-grow
- flex-shrink
- flex-wrap
- float
- gap
- grid
- grid-area
- grid-auto-columns
- grid-auto-flow
- grid-auto-rows
- grid-column
- grid-column-end
- grid-column-start
- grid-row
- grid-row-end
- grid-row-start
- grid-template
- grid-template-areas
- grid-template-columns
- grid-template-rows
- justify-content
- justify-items
- justify-self
- order
- overflow
- overflow-anchor
- overflow-block
- overflow-inline
- overflow-wrap
- overflow-x
- overflow-y
- place-content
- place-items
- place-self
- position-anchor
- position-area
- position-try
- position-try-fallbacks
- position-try-order
- position-visibility
- resize
- row-gap
- table-layout
- text-overflow
- visibility
- z-index
- reading-flow 🧪
- reading-order 🧪
- align-tracks 🚧
- block-ellipsis 🚧
- block-step 🚧
- block-step-align 🚧
- block-step-insert 🚧
- block-step-round 🚧
- block-step-size 🚧
- bookmark-label 🚧
- bookmark-level 🚧
- bookmark-state 🚧
- column-height 🚧
- column-rule-break 🚧
- column-rule-outset 🚧
- column-wrap 🚧
- continue 🚧
- float-defer 🚧
- float-offset 🚧
- float-reference 🚧
- flow-from 🚧
- flow-into 🚧
- grid-column-gap 🚧
- grid-gap 🚧
- grid-row-gap 🚧
- inline-sizing 🚧
- item-cross 🚧
- item-direction 🚧
- item-flow 🚧
- item-pack 🚧
- item-tolerance 🚧
- item-track 🚧
- item-wrap 🚧
- justify-tracks 🚧
- region-fragment 🚧
- row-rule 🚧
- row-rule-break 🚧
- row-rule-color 🚧
- row-rule-outset 🚧
- row-rule-style 🚧
- row-rule-width 🚧
- rule 🚧
- rule-break 🚧
- rule-color 🚧
- rule-outset 🚧
- rule-overlap 🚧
- rule-style 🚧
- rule-width 🚧
- wrap-after 🚧
- wrap-before 🚧
- wrap-flow 🚧
- wrap-inside 🚧
- wrap-through 🚧
- page-break-after 🗑️
- page-break-before 🗑️
- page-break-inside 🗑️