Case ce-0134-nested-list-tab-indent · Scenario scenario-nested-list-behavior

Tab key does not indent list items to create nested lists

OS: Windows 11 Device: Desktop or Laptop Any Browser: Chrome 120.0 Keyboard: US Status: draft
list nested tab indentation chrome

Phenomenon

When pressing Tab in a list item in Chrome, a tab character is inserted instead of indenting the list item to create a nested list structure. This makes it difficult to create nested lists.

Reproduction example

  1. Create a list: <ul><li>Item 1</li><li>Item 2</li></ul>
  2. Place cursor in “Item 2”
  3. Press Tab

Observed behavior

  • Tab character is inserted into the list item
  • List item is not indented
  • Nested list structure is not created
  • User cannot easily create nested lists

Expected behavior

  • Tab should indent list item (create nested list)
  • Shift+Tab should unindent
  • Nested list structure should be created
  • Behavior should match word processors

Browser Comparison

  • All browsers: Tab inserts character (default behavior)
  • Custom handling needed for list indentation

Notes and possible direction for workarounds

  • Intercept Tab key in list items
  • Prevent default behavior
  • Create nested list structure
  • Move list item to nested list
  • Handle Shift+Tab for unindenting
Before
  • Item 1
  • Item 2
List, cursor inside 'Item 2'
After Tab (Bug)
  • Item 1
  • Item 2\t
Tab key inserts tab character, nested list not created
vs
✅ Expected
  • Item 1
    • Item 2
Expected: Tab key creates nested list (indentation)

Browser compatibility matrix

This matrix shows which browser and OS combinations have documented cases for this scenario. The current case is highlighted. Click on a cell to view other cases.

Current case
Confirmed
Draft
No case documented

All variants (detailed table)

Complete list of all cases for this scenario with full environment details.

Case OS Device Browser Keyboard Status
ce-0099-nested-list-enter-chrome Windows 11 Desktop or Laptop Any Chrome 120.0 US draft
ce-0134-nested-list-tab-indent Windows 11 Desktop or Laptop Any Chrome 120.0 US draft
ce-0143-nested-list-backspace Windows 11 Desktop or Laptop Any Firefox 120.0 US draft

Playground for this case

Use the reported environment as a reference and record what happens in your environment while interacting with the editable area.

Reported environment
OS: Windows 11
Device: Desktop or Laptop Any
Browser: Chrome 120.0
Keyboard: US
Your environment
Sample HTML:
Event log
Use this log together with the case description when filing or updating an issue.
0 events
Interact with the editable area to see events here.

Comments & Discussion

Have questions, suggestions, or want to share your experience? Join the discussion below.