Split editor window in VS Code
Question:
How to split editor window in VS Code? Answer:
CTRL + \ - Splits the actual editor into two
ALT + Click - Opens the file in the Explorer in a side panel
CTRL + ENTER - Opens the file in the Quick Open in a side panelDescription:
Visual Studio Code offers a lot of options to split the screen into several parts, either vertically or horizontally. By default editors will open to the right-hand side of the active one. You can change this behavior through the setting workbench.editor.openSideBySideDirection.
Split editor using keyboard shortcut
Multiple keyboard shortcuts can be used to split the editor window vertically depending on the current context.
- If the code editor is active then you can split into two by
CTRL + \ - If the Quick Open panel is active then
CTRL + ENTERwill open the selected file on the side. - Press
F1to open the Command Palette and type split. Select the variant you want.
Split the editor window using the mouse
There are also several ways to split the screen using the mouse.
- Right click on the file tab. From the context menu select the Split Up or Split Down if you want to split horizontally or the Split Right or Split Left to split vertically.
- You can also drag and drop a file to any side of the editor region.
- Use the Split editor icon on the top right corner to split the editor window.
- Use the menu
View -> Editor Layout -> Split Right
Switch between editors
When you have more than one editor open you can switch between them quickly by holding the Ctrl + 1 , CTRL + 2 , or CTRL + 3 .
Reference:
Side by side editing reference
Share "How to split editor window in VS Code?"
Related snippets:
- Fix: Prettier stopped working in VS Code
- Split editor window in VS Code
- Change default terminal in VS Code
- Wrap selection with tag in VS Code
- Edit multiple lines at once in VS Code
- Make text uppercase in VS Code
- Associate file type in VS Code
- Change syntax highlighting in VS Code
- Search for file in VS Code
- Collapse code blocks in VS Code
- Open files always in a new tab in VS Code
- Add vertical rulers in VS Code
- Change indentation in VS Code
- Delete line without selection in VS Code
- Jump to closing bracket in VS Code
- Select all occurrences of selected word in VS Code
- Change font size in VS Code
- Toggle minimap in VS Code
- Change colors in VS Code integrated terminal
- Change file encoding in VS Code
- Disable tooltip in VS Code
- Move the sidebar panel to the right in VS Code
- Export VS Code extensions
- Toggle word wrap in VS Code
- Exclude folders from search in VS Code
- Show hidden characters in VS Code
- Remove trailing spaces in VS Code
- Get multiple cursors in VS Code
- Go back to last edited position in VS Code
- Switch between terminal and editor in VS Code
- Open VS Code with the current folder from terminal
- Navigate back to last cursor position in VS Code
- Change terminal font size in VS Code
- Format code in VS Code
- Compare two files in VS Code
- Comment out multiple lines in VSCode
- Duplicate line or selection in VS Code
- Go to line in VS Code
- Move line up or down in VS Code
Tags:
vscode, split, editor, window, screen, vertically, horizontally, down, right, shortcut Technical term:
Split editor window in VS Code