Adding and customizing columns in posts

Columns let you organize content side by side in your newsletter, making it easier to highlight multiple ideas at once — like links, promos, images, or comparisons — without overwhelming readers. In beehiiv posts, you can add up to three columns per section and fully customize their layout, spacing, and appearance for both desktop and mobile.

This guide shows you how to add columns to a post and adjust their layout and design.

1. Open an existing post or click Start writing to create a new post. 
    
2. On the Compose page, type / to access the post editor, then select Columns under Basics.
   
   
   
3. A two-column layout will appear by default. To adjust the structure, click the options icon above the columns.
   
   
   
   
    
4. From the column layout options, you can:

• Add up to three columns.
• Adjust the width of each left, middle, or right column.
• Set vertical alignment (top, middle, bottom) for content within each column.
• Enable or disable column stacking on mobile for better responsiveness.

To further customize the look and behavior of your columns, click the 6 dots menu to the left of the column block.

From this menu, you can:

• Group to section: Wrap columns into a section for shared styling or layout control.
• Comment: Leave internal notes on the post for yourself or @ your team members.
• Visual settings: Adjust spacing, borders, background color, and text color.
• Visibility: Control whether columns appear for certain subscribers or on email vs. web.
• Anchor: Create a linkable anchor for navigation.
• Reset text formatting: Remove custom text styling.
• Duplicate: Create a copy of the column layout.
• Copy to clipboard: To paste the columns elsewhere in your post.
• Delete: Remove the columns entirely.

There is no dedicated gap slider for columns. Spacing is controlled in two places: the Style Sidebar on the right panel (global controls that apply across the entire post) and the per-block drag handle (controls for individual content blocks inside a column).

Global padding affects every column in the post simultaneously.

To adjust it:

1. Open the Style Sidebar on the right side of the editor.
2. Select the Advanced tab.
3. Open the Background accordion section.
4. Adjust the Padding control using the All toggle (uniform padding on all sides) or Individual toggle (per-side control).

To create tight or flush columns, such as for edge-to-edge images, reduce this padding to 0, then add spacing to individual content blocks only where needed.

To control padding on a specific block inside a column, use the block's drag handle:

1. Click the 6 dots menu to the left of the block. 
2. Select Visual settings. 
3. Go to Spacings and adjust Padding.

Images inside columns have their own padding setting that is separate from both global and per-block controls.

To remove image padding globally:

1. Open the Style Sidebar on the right side of the editor.
2. Select the Advanced tab.
3. Open the Widgets accordion section.
4. Select the Images tab.
5. Set Padding to 0 using the All or Individual toggle.

If columns look misaligned, overlap each other, or extend off the screen on a mobile device, enable the stacking toggle for that block. Stacking is the recommended layout for most mobile readers.

1. Click into the column block. 
2. In the floating toolbar that appears above it, click the gear icon > enable Stack columns.

When the stacking toggle is disabled, the second column may not appear at all when a reader views the post in a mobile browser. The email version renders correctly and is unaffected.

This is a known limitation of the web post view for non-stacked column layouts. The workaround below lets email and web readers each receive an appropriate layout:

1. Keep the stacking toggle disabled and publish the post. Email subscribers receive the side-by-side layout as intended.
2. After the email has been sent, return to the post, enable the stacking toggle, and republish. Mobile web readers will then see a stacked layout.

When the stacking toggle is disabled, columns may expand past the screen width or scale incorrectly on mobile web rather than staying side by side. The email version is unaffected.

This is the same known limitation as above. Publish first with the stacking toggle disabled so email subscribers receive the side-by-side layout, then enable it and republish for the web version.

If images inside a column show unexpected padding that shifts the column layout:

1. Open the Style Sidebar on the right side of the editor.
2. Select the Advanced tab.
3. Open the Widgets accordion section, then select the Images tab.
4. Set Padding to 0.
5. If uneven spacing remains, go to Advanced > Background and check the Padding values there as well.