diff --git a/extensions/notebook-renderers/src/index.ts b/extensions/notebook-renderers/src/index.ts
index 8648045a8c1..f0f28feb2fb 100644
--- a/extensions/notebook-renderers/src/index.ts
+++ b/extensions/notebook-renderers/src/index.ts
@@ -270,7 +270,7 @@ export const activate: ActivationFunction<void> = (ctx) => {
 	.traceback.wordWrap span {
 		white-space: pre-wrap;
 	}
-	.output > .scrollable {
+	.output .scrollable {
 		overflow-y: scroll;
 		max-height: var(--notebook-cell-output-max-height);
 		border: var(--vscode-editorWidget-border);
diff --git a/extensions/notebook-renderers/src/textHelper.ts b/extensions/notebook-renderers/src/textHelper.ts
index 3555307ec9d..560aec613e0 100644
--- a/extensions/notebook-renderers/src/textHelper.ts
+++ b/extensions/notebook-renderers/src/textHelper.ts
@@ -50,14 +50,14 @@ function truncatedArrayOfString(id: string, buffer: string[], linesLimit: number
 }
 
 function scrollableArrayOfString(id: string, buffer: string[], container: HTMLElement, trustHtml: boolean) {
-	container.classList.add('scrollable');
+	const scrollableDiv = document.createElement('div');
+	scrollableDiv.classList.add('scrollable');
 
 	if (buffer.length > 5000) {
 		container.appendChild(generateViewMoreElement(id, false));
 	}
-	const div = document.createElement('div');
-	container.appendChild(div);
-	div.appendChild(handleANSIOutput(buffer.slice(0, 5000).join('\n'), trustHtml));
+	container.appendChild(scrollableDiv);
+	scrollableDiv.appendChild(handleANSIOutput(buffer.slice(0, 5000).join('\n'), trustHtml));
 }
 
 export function insertOutput(id: string, outputs: string[], linesLimit: number, scrollable: boolean, container: HTMLElement, trustHtml: boolean) {