---
title: "How to Make a Top Section Sticky with Kadence Blocks"
source: "https://docs.nexcess.com/software/kadence/blocks/make-top-section-sticky-kadence-blocks/"
description: "The Row Layout Block is commonly used to create sticky left or right sections. This setup allows one side of your layout to stay visible as the other side scrol…"
vertical: "Software"
area: "Kadence Blocks"
date: "2025-10-09"
last_modified: "2026-07-02"
---

# How to Make a Top Section Sticky with Kadence Blocks

The **Row Layout Block** is commonly used to create sticky left or right sections. This setup allows one side of your layout to stay visible as the other side scrolls.   
  
However, there may be times when you want a **top section** to remain visible and overlay the content below as the page scrolls. In that case, the [**Kadence Section Block**](https://docs.nexcess.com/software/kadence/section-block/) can help you achieve that effect.

![Sticky Top Section](https://docs.nexcess.com/wp-content/uploads/2026/06/Sticky-Top-Section.gif)

Getting Started

Start by adding a **Section** **Block** to a page.

![Step One Add a Section Block](https://docs.nexcess.com/wp-content/uploads/2026/06/Step-One-Add-a-Section-Block-scaled-1.jpg)

Inside the Section Block, add **two** **more** **nested** **Section** **Blocks**. By default, they will stack.

![Nesting Sections](https://docs.nexcess.com/wp-content/uploads/2026/06/Nesting-Sections.gif)

Then, add the **Sticky** **Content** you wish to display to the **First** **Section** and the **other** **contents** in the **Second** **Section**.

![Adding Nested Contents](https://docs.nexcess.com/wp-content/uploads/2026/06/Adding-Nested-Contents.jpg)

Once your content is ready, select the **First** **Section** and go to the **Block Settings -> Advanced Tab -> Sticky Settings** and enable the **Sticky** **Section** feature.

![Making a Section Sticky](https://docs.nexcess.com/wp-content/uploads/2026/06/Making-a-Section-Sticky-scaled-1.jpg)This will effectively make the **Top** **Section** overlay the **Bottom** **Section** as the user scrolls down the page. See the GIF below for reference.

![Sticky Top Section](https://docs.nexcess.com/wp-content/uploads/2026/06/Sticky-Top-Section.gif)