---
title: "Section & Column Block"
description: "To customize the Section & Column Block, you can use the below settings: ##### Settings for Section Block - **General** - **Content Width:** Select the width of the section using **container** and **container-fluid** options. - **Container Width:** Set the width…"
url: "https://spiceblocks.com/docs/section-column-block/"
updated: "2023-02-21"
category: Blocks Customization
---

# Section & Column Block

To customize the Section & Column Block, you can use the below settings:

##### Settings for Section Block

- **General**
  - **Content Width:** Select the width of the section using **container** and **container-fluid** options.
  - **Container Width:** Set the width of the section container.
  - **Columns:** Select the number of columns.
  - **Z-index:**Using the z-index option overlap the section and column.
  - **Display:** Hide/Show the section individually from a desktop, tablet, or mobile.
  - **Animation Effects:** Set the animation effects with multiple options on the section like Fade, Bounce, Swing, etc.

- **Spacing**
  - **Margin:** Adjust the margin of the section.
  - **Padding:** Adjust the padding of the section.

- **Background**
  - **Background Color:** Set the background color of the section.
  - **Background Type:** Select an image type option which offers more settings related to the background image.
    - **Add Image:** Set the background image of the section.
    - **Enable Parallax:** Enable the parallax effect.
    - **Background Size:** Set background image size using Default, Cover, Contain, and Auto options.
    - **Background Repeat:** Adjust the background image repetition.

- **Background Overlay:** This setting appears on selecting the Background type image option.
  - **Enable Overlay**: Show/hide the overlay of the section. On enabling the overlay of the section image, additional settings appears below:
    - **Overlay Color:** Set the color of the overlay image.
    - **Overlay Opacity:** Set the opacity of the overlay image.

- **Border**
  - **Border:** Adjust the border of the section using border **style, color, and width** options.
  - **Border Radius:** Adjust the radius of the section border.

- **Box Shadow**
  - Adjust the box shadow of the Icon using **Horizontal, Vertical, and Blur** Shadow options.
  - Set the box shadow color using the **Box Shadow Color** option.

##### Settings for Column Block

- **General**
  - **Overlay Opacity:** Adjust the opacity of the column overlay.
  - **Z-index:**Using the z-index option overlap the section and column.
  - **Display:** Hide/Show the column individually from a desktop, tablet, or mobile.
  - **Animation Effects:** Set the animation effects with multiple options on the section like Fade, Bounce, Swing, etc.

- **Spacing**
  - **Width:** Set the width of the column.
  - **Margin:** Adjust the margin of the column.
  - **Padding:** Adjust the padding of the column.

- **Background**
  - **Background Color:** Set the background color of the column on mouse hover and normal effects.
  - **Background Type:** Select an image type option which offers more settings related to the background image.
    - **Add Image:** Set the background image of the column.
    - **Enable Parallax:** Enable the parallax effect.
    - **Background Size:** Set background image size using Default, Cover, Contain, and Auto options.
    - **Background Repeat:** Adjust the background image repetition.

- **Background Overlay:** This setting appears on selecting the Background type image option.
  - **Enable Overlay**: Show/hide the overlay of the column. On enabling the overlay of the column image, additional settings appears below:
    - **Overlay Color:** Set the color of the overlay image.
    - **Overlay Opacity:** Set the opacity of the overlay image.

- **Border**
  - **Border:** Adjust the border of the column using border **style, color, and width** options.
  - **Border Radius:** Adjust the radius of the column border.

- **Box Shadow**
  - Adjust the box shadow of the Icon using **Horizontal, Vertical, and Blur** Shadow options.
  - Set the box shadow color using the **Box Shadow Color** option.
