Find closing HTML tag in Sublime Text

Question

I have a very long and very nested HTML document, where I need to quickly find the closing tag. How can I do this?

see also http://superuser.com/questions/489879/edit-both-opening-and-closing-html-tag Ctrl + Shift + ' // with emmet plugin — Eran Or, Mar 24 '15 at 20:41

score 140 · Accepted Answer · edited May 23 '15 at 22:12

140

Try Emmet plug-in command Go To Matching Pair:

http://docs.emmet.io/actions/go-to-pair/

Shortcut (Mac): Shift + Control + T

Shortcut (PC): Control + Alt + J

https://github.com/sergeche/emmet-sublime#available-actions

edited May 23 '15 at 22:12

Mark Amery

143,130
81
406
459

answered Feb 11 '13 at 14:35

Mikko Ohtamaa

82,057
50
264
435

1

Cool, thanks. I am actually using Emmet so that is ideal. The shortcut is: **Shift + Control + T**. – Pavel Binar Feb 11 '13 at 14:46
1

for Windows user, the shortcut at the time of writing is Control + Alt + J – cyberfly Mar 13 '13 at 02:41
2

Thanks! Control + Alt + J works in Linux as well (tested under Linux Mint 14, Sublime Text 3) – José Tomás Tocino Apr 24 '14 at 16:07
@AllanRuin Ruin For me on Windows, with Emmet active in ST2, it just works to jump to the closing tag from starting tag, not the other way round. – Volker E. Apr 27 '14 at 20:24
2

Emmet plugin works great. You dont HAVE to use the keyboard shortcut, just open you Palette in sublime (Shift + Command + P) and start typing 'matching pair') – Max Aug 20 '14 at 21:45

score 137 · Answer 2 · edited Aug 09 '21 at 14:53

137

There is a shortcut (Ctrl+Shift+A for Windows and Linux users, Command+Shift+A for Mac users) to select the whole block within the currently selected tag.

For example, if you pressed this while your text cursor was within the outer div tag in the code below, all the divs with class selected would be selected.

<div class='current_tag_block'>
  <div class='selected'></div>
  <div class='selected'></div>
  <div class='selected'></div>
  <div class='selected'></div>
</div>

As @frazer-kirkman mentioned in a comments you can also move your cursor to the start or to the end of the selected block by pressing either Left or Right button on a keyboard depending on your cursor's position

edited Aug 09 '21 at 14:53

Sultan Dadakhanov

57
8

answered Jun 18 '14 at 03:50

jeffsama

1,597
1
9
7

9

To select the parent tag as well, just use the shortcut again and it expands the selection! – TimoSolo Sep 16 '15 at 11:01
it doesn't exactly answer the question, but the answer then becomes trivial. To find the closing tag you need to look at the end of the selection, or push the right arrow key. – Frazer Kirkman Aug 01 '17 at 10:36
Where is this documented? Is this combination part of some plugin? It is impossible to find this on the following: http://docs.sublimetext.info/en/latest/reference/keyboard_shortcuts_win.html – Gabe Hiemstra Mar 15 '18 at 14:29
You sir, deserve an upvote +1. It's also possible on Visual Studio!: `Shift` + `Alt` + `=` to expand and `Shift` + `Alt` + `-` to deselect – Ozkan Jan 24 '19 at 14:43

score 13 · Answer 3 · answered Jun 03 '14 at 12:40

13

It's built in from Sublime Editor 2 at least. Just press the following and it balances the HTML-tag

Shortcut (Mac): Shift + Command + A

Shortcut (Windows): Control + Alt + A

answered Jun 03 '14 at 12:40

K. Kilian Lindberg

2,918
23
30

score 5 · Answer 4 · answered Sep 06 '17 at 04:27

None of the above worked on Sublime Text 3 on Windows 10, Ctrl + Shift + ' with the Emmet Sublime Text 3 plugin works great and was the only working solution for me. Ctrl + Shift + T re-opens the last closed item and to my knowledge of Sublime, has done so since early builds of ST3 or late builds of ST2.

score 4 · Answer 5 · answered Sep 28 '14 at 16:37

4

Under the "Goto" menu, Control + M is Jump to Matching Bracket. Works for parentheses as well.

answered Sep 28 '14 at 16:37

Jeremy Ross

11,544
3
36
36

32

Works for brackets, works for parenthesis, but not work for html tags. – John Pancoast Oct 14 '14 at 19:25
8

−1. Doesn't answer the question, which is about HTML tags. – Zenadix Mar 15 '16 at 19:17
It is only finding matching parentheses. How do I set this feature to also look for `{ } [] <>` ? – SherylHohman Jan 03 '18 at 19:43

score 4 · Answer 6 · answered Dec 12 '16 at 11:06

As said before, Control/Command + Shift + A gives you basic support for tag matching. Press it again to extend the match to the parent element. Press arrow left/right to jump to the start/end tag.

Anyway, there is no built-in highlighting of matching tags. Emmet is a popular plugin but it's overkill for this purpose and can get in the way if you don't want Emmet-like editing. Bracket Highlighter seems to be a better choice for this use case.

score 3 · Answer 7 · answered Nov 24 '17 at 10:38

3

I think, you may want to try another approach with folding enabled.

In both ST2 and ST3, if you enable folding in User settings:

{
    ...(previous item)
    "fold_buttons": true,
    ...(next item, thus the comma)
}

You can see the triangle folding button at the left side of the line where the start tag is. Click it to expand/fold. If you want to copy, fold and copy, you get all block.

answered Nov 24 '17 at 10:38

WesternGun

11,303
6
88
157

The problem with this for me is that I type `` + TAB and if it doesn't close the correct tag, I know that I've got a dangling open tag somewhere, I just don't know WHERE that open tag is in this 6000 line HTML file. – Mark Tomlin Apr 09 '20 at 18:18
Try some formatting plugin? Maybe codelint or something? Some online ones, maybe – WesternGun Apr 14 '20 at 10:29

Find closing HTML tag in Sublime Text

7 Answers7

Linked