7 CSS Dividers
Collection of free HTML and CSS divider code examples: vertical, horizontal, etc.
- Horizontal Dividers
- Vertical Dividers
- HTML <hr> with CSS
- CSS Headers and Footers
- CSS Timelines
HTML and CSS horizontal divider code examples (6 items).
Author
- Alexandr Kazakov
About the code
SVG Page Separator
Simple page separator with SVG.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Dependencies: -
![Row Separator - GIF Demo]( "Row Separator")
About the code
Row Separator
Row Separator - collection of divider styles.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Dependencies: -
Author
- chilli con code
About the code
Responsive Scalloped Page Dividers
Responsive scalloped page dividers using CSS gradients.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Dependencies: -
Author
- chilli con code
About the code
Responsive Skewed Page Dividers
Responsive skewed page dividers using CSS gradients only.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Dependencies: -
![Rainbowy Dashed Divider - GIF Demo]( "Rainbowy Dashed Divider")
Author
- Simon Goellner
About the code
Rainbowy Dashed Divider
Pretty CSS rainbowy dashed divider.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Dependencies: -
![A Collection of Separator Styles - GIF Demo]( "A Collection of Separator Styles")
About the code
A Collection of Separator Styles
A collection of separator styles for horizontally dividing sections on a website. The dividers are created using several techniques, including styling pseudo-elements, using gradients and inserting SVG graphics with responsiveness in mind.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Dependencies: -
HTML and CSS vertical divider code examples (1 items).
![Vertical Divider - GIF Demo]( "Vertical Divider")
About the code
Vertical Divider
CSS vertical divider - coloured and animated.
Compatible browsers: Chrome, Edge, Firefox, Opera, Safari
Dependencies: bootstrap.css