knowledgecenter-breadcrum

Knowledge Center

15 Mar, 2022

How to make a Detail List scrollable?

Posted on 15 Mar, 2022 by Admin, Posted in Dynamics 365 Dynamics-365 Sales

How to make a Detail List scrollable? Blogs

How to make a DetailList scrollable?

Introduction

Recently, we created a DetailList type of PCF control to display some data.

As this list was going to display hundreds of records, we couldn’t scroll through them as there was no scroller present.

Solution

After a bit of research we found that a scroller can be added by importing “ScrollablePane” component from Fluent UI library using the below command:

import { ScrollablePane, ScrollbarVisibility } from ‘office-ui-fabric-react’;

We add the ScrollablePane tag just above our DetailList tag as shown below.

After building the PCF control, now we can see that our list is scrollable.

Jan 2022 blog 2 gif

Links

Comment

This is a Required Field

Loading

Recent Updates

Blogs
20 Jan, 2026

How to Add Dataverse as a Data Source in Power Apps Code Apps

In my previous blog, I explained what Power Apps Code Apps are and how we can build apps using React…

READ MORE
Blogs
12 Jan, 2026

Why Power Apps Component Framework (PCF) Is Becoming a Game-Changer in Power Apps Development

Introduction Power Apps is one of the most widely used platforms for building business applications. As organizations grow, they expect…

READ MORE
Blogs
01 Dec, 2025

Dynamics 365: Why One User Could Edit a Field and Another Couldn’t

Recently, we faced an issue in Dynamics 365 where the field was locked for one user but editable for another. The field…

READ MORE