Source terminal dimensions from only the outer container

The inner container may not be created/attached yet.

Fixes #31235

src/vs/workbench/parts/terminal/electron-browser/media/terminal.css

@@ -17,6 +17,7 @@
 .monaco-workbench .panel.integrated-terminal .terminal-outer-container {
 	height: 100%;
 	padding-left: 20px; /*Don't use right padding in case xterm.js misbehaves*/
+	padding-bottom: 2px;
 	width: 100%;
 	box-sizing: border-box;
 }
@@ -27,9 +28,8 @@
 .monaco-workbench .panel.integrated-terminal .terminal-wrapper.active {
 	display: block;
 	position: absolute;
-	bottom: 0;
+	bottom: 2px; /* Matches padding-bottom on .terminal-outer-container */
 	top: 0;
-	padding-bottom: 2px;
 }
 
 .monaco-workbench .panel.integrated-terminal .xterm a:not(.xterm-invalid-link) {

src/vs/workbench/parts/terminal/electron-browser/terminalInstance.ts

@@ -205,8 +205,10 @@ export class TerminalInstance implements ITerminalInstance {
 			}
 		}
 
-		const padding = parseInt(getComputedStyle(document.querySelector('.terminal-outer-container')).paddingLeft.split('px')[0], 10);
-		const paddingBottom = parseInt(getComputedStyle(document.querySelector('.terminal-wrapper.active')).paddingBottom.split('px')[0], 10);
+		const outerContainer = document.querySelector('.terminal-outer-container');
+		const outerContainerStyle = getComputedStyle(outerContainer);
+		const padding = parseInt(outerContainerStyle.paddingLeft.split('px')[0], 10);
+		const paddingBottom = parseInt(outerContainerStyle.paddingBottom.split('px')[0], 10);
 
 		// Use left padding as right padding, right padding is not defined in CSS just in case
 		// xterm.js causes an unexpected overflow.