# Columns Block Style: Dividing Lines

> Adds a "Dividers" style to the Columns block that draws a thin vertical line between columns on wide screens and a horizontal one when they stack on phones.

- Type: PHP
- Runs: Run everywhere
- Category: [Block Editor](https://wpide.com/library/category/gutenberg/)
- Tags: block-styles, columns, layout
- Author: WPIDE Team
- Installs: 0
- Updated: 2026-10-28
- Page: https://wpide.com/library/block-styles-columns-dividers/

## Code

```php
add_action( 'init', function () {
    register_block_style( 'core/columns', array(
        'name'         => 'wpide-dividers',
        'label'        => 'Dividers',
        'inline_style' => '.wp-block-columns.is-style-wpide-dividers>.wp-block-column+.wp-block-column{border-top:1px solid rgba(0,0,0,.15);padding-top:1.5em;}@media (min-width:782px){.wp-block-columns.is-style-wpide-dividers>.wp-block-column+.wp-block-column{border-top:0;padding-top:0;border-left:1px solid rgba(0,0,0,.15);padding-left:2em;}}',
    ) );
} );
```

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Columns Block Style: Dividing Lines" in its snippet library and add it in one click; or create a new PHP snippet in WPIDE (or any code snippets plugin) and paste the code above. More snippets: https://wpide.com/library/