Unwanted span tags with inline styles created when removing line breaks
OS: Any Any · Device: Desktop or Laptop Any · Browser: Chrome Latest · Keyboard: US
Open case →Scenario
Unwanted span tags with inline styles created when removing line breaks
Unwanted span tags with inline styles created when removing line breaks
Scenario ID
scenario-nested-inline-span-tags-created
Scenario flow
Visual view of how this scenario connects to its concrete cases and environments. Nodes can be dragged and clicked.
Variants
Each row is a concrete case for this scenario, with a dedicated document and playground.
| Case | OS | Device | Browser | Keyboard | Status |
|---|---|---|---|---|---|
| ce-0314-nested-inline-span-tags-created | Any Any | Desktop or Laptop Any | Chrome Latest | US | draft |
Cases
Open a case to see the detailed description and its dedicated playground.
Related Scenarios
Other scenarios that share similar tags or category.
Tags: chrome, formatting
execCommand is deprecated but still widely used for formatting
The document.execCommand() API, which is commonly used to apply formatting (bold, italic, etc.) in contenteditable regions, has been deprecated. However, there is no complete replacement, and many implementations still rely on it. This creates uncertainty about future browser support.
1 case
Tags: chrome, formatting
insertHTML breaks DOM structure and formatting
When using document.execCommand('insertHTML', ...) to insert HTML content into a contenteditable region, the DOM structure may be broken or reformatted unexpectedly. Nested elements may be flattened or reorganized.
1 case
Tags: chrome
autofocus attribute does not work on contenteditable
The autofocus attribute, which automatically focuses form inputs on page load, does not work on contenteditable elements. There is no built-in way to automatically focus a contenteditable region when a page loads.
1 case
Tags: formatting
Selection mismatch between beforeinput and input events
The selection (window.getSelection()) in beforeinput events can differ from the selection in corresponding input events. This mismatch can occur during IME composition, text prediction, or when typing adjacent to formatted elements like links. The selection in beforeinput may include adjacent formatted text, while input selection reflects the final cursor position.
1 case
Tags: chrome
Text caret is invisible on position:relative elements
When editing content inside an element with `position:relative`, the text caret (cursor) is completely invisible. Text can be typed and appears in the editor, but there's no visual feedback of where the insertion point is located.
2 cases
Comments & Discussion
Have questions, suggestions, or want to share your experience? Join the discussion below.