nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

2 columns with independent scrolling

Dumitru Daniel

Hello,

I am an employee of Adobe and i am administrating a section of Adobe Wiki (wiki.corp.adobe.com).

I was wondering if there is any way i could have 2 independent scrolling columns, 1 left column that is fixed and does not scroll with the other one, a Table of contents, and one to the right containing the actual page contents.

I appreciate your answer,

Kind regards,

Daniel

Accepted answers

All comments

Steffen Heller

Hi Daniel,

If you don't find a macro for this you can create that yourself.

Put the scrollable area in a div and link it with a class like this

.scroll {
overflow: auto;
height: 500px; 
}

PS: Your link doesn't work.

Michel Meester

Hi Steffen,

Where do you do this?

Can you show me where you fill this in?

Kind regards,

Michel

Steffen Heller

Click Edit
Insert the CSS macro: Insert > Other Macros > CSS Stylesheet > Insert
Enter the code from above
Add a section to the page: Insert > Other Macros > Section
Insert two columns inside the section: Insert > Other Macros > Column
Insert the Table of contents macro inside the first column: Insert > Other Macros > Table of Contents
Insert a div inside the second column: Insert > Other Macros > Div
Double click and edit the div: Enter "scroll" at "Class"
Add text with headings to the second column

Welcome!

It looks like you're new here. Sign in or register to get started.

Quick Links

Find more posts tagged with

confluence

cloud

confluence-cloud