When does whitespace matter in HTML?

Question

example 1

onetwo


    one
    <         


        
      

Answer 1

A full answer to the question “When does whitespace matter in HTML?” would be rather long and detailed and would need to discuss things like whitespace between attribute specifications and elements with special rules like textarea. But the address what seems to be the primary concern:

Whitespace between tags generally creates anonymous text nodes. Whitespace inside leaf elements (elements not containing other elements) constitutes part of the text content of the element.

There are few fixed rules for rendering, but browsers generally ignore leading and trailing whitespace within an element’s text content.

If there is whitespace between elements that are rendered inline (such as button elements by default), it normally acts as a separator equivalent to one space.

However, whitespace consisting of one line break is ignored, by specifications and usually in browser practice, when it immediately follows a start tag or precedes an end tag. So

one
two

would be treated as if the line breaks were not there. But when spaces are used, as in

  one
  two

then there are anonymous text nodes before the first button element and between the two button elements. Normally only the latter matters, and it acts like a normal word space.

Update: As a comment below and Alohci’s answer point out, this old (HTML 4.01) principle has mostly not been implemented in browsers and has mostly been removed in HTML5. So in most cases, a line break between elements creates a text node, containing a line break character, which is treated as equivalent to a space.