-1

In order to break long lines of text in the HTML source (because I prefer source code that approaches human readability) without introducing whitespace when rendered, I have used source similar to

<! DOCTYPE HTML>
<html>
<body>    
<p>
    Span<span/
    >in<span/    
    >the<span/
    >place<span/
    >where<span/
    >you<span/
    >live.
</p>
</body>    
</html>

Which renders something like

Spanintheplacewhereyoulive.

However, I am not sure why this seems to work (using recent Chrome and Firefox, and a version of Konqueror). The standard seems not to cover this situation, unless I have missed it. A related post suggests to me that the above example is not valid, insofar as the <span/ > tags are concerned.

Not sure it matters, but I want to emphasize that there is whitespace between the / and > in <span/ >. This is lexically distinct from <span /> and <span/>, although I don't know if it's semantically different.

Why does <span/ > render, producing an empty span? Am I accessing some browser-specific behavior?

Appendix

As far as I can tell, a correct way to break an empty span would be, for example, "Broken Up":

<! DOCTYPE HTML>
<html>
<body>    
<h2>
                Continuous
</h2>
<p> /this/is/a/path/that/seems/not/to/end/it/goes/on/and/on/my/friend/someone/started/typing/it/not/knowing/what/it/was/and/they/will/continue/typing/a/long/time/because/this/is/a/path/that/seems/not/to/end/it/goes/on/and/on/my/friend/someone/started/typing/it/not/knowing/what/it/was/and/they/will/continue/typing/a/long/time/because
</p>
<h2>
                Broken Up
</h2>
<p>
<!-- 6789012345678901234567890123456789012345678901234567890 -->
                /this/<wbr>is/a/<wbr>path/<wbr><span></span
                >that/<wbr>seems/<wbr><span></span
                >not/to/<wbr>end/<wbr><span></span
                >it/goes/<wbr>on/and/<wbr><span></span
                >on/my/<wbr>friend/<wbr><span></span
                >someone/<wbr>started/<wbr><span></span
                >typing/<wbr>it/<wbr>not/<wbr><span></span
                >knowing/<wbr>what/<wbr>it/was/<wbr><span></span
                >and/<wbr>they/<wbr>will/<wbr><span></span
                >continue/<wbr>typing/a/<wbr><span></span
                >long/<wbr>time/<wbr>because/<wbr><span></span
                >this/<wbr>is/a/<wbr>path/<wbr><span></span
                >that/<wbr>seems/<wbr><span></span
                >not/to/<wbr>end/<wbr><span></span
                >it/goes/<wbr>on/and/<wbr><span></span
                >on/my/<wbr>friend/<wbr><span></span
                >someone/<wbr>started/<wbr><span></span
                >typing/<wbr>it/<wbr>not/<wbr><span></span
                >knowing/<wbr>what/<wbr>it/was/<wbr><span></span
                >and/<wbr>they/<wbr>will/<wbr><span></span
                >continue/<wbr>typing/a/<wbr><span></span
                >long/<wbr>time/<wbr>because/
</p>
</body>    
</html>
Ana Nimbus
  • 635
  • 3
  • 16
  • I'm curious why you would want to render lines of text that are intended to be readable without any spaces. Anyway, it seems the code doesn't actually produce empty `span` tags, but rather opens a tag that wraps the following text. It also seems to close only when a new tag opens. – Leonardo Baptista Lopes Aug 05 '22 at 19:35
  • @LeonardoBaptistaLopes RE "why... render... text... without any spaces:" For example, I may have narrow columns in my source code (maybe 48 characters) and long words (e.g., UUID's) where I need to insert `` or other tags, which makes words even longer---so that they don't fit on one line of formatted source code. – Ana Nimbus Aug 05 '22 at 20:17

1 Answers1

0

Why does <span/ > render, producing an empty span?

It doesn't.

The / is treated as an error and discarded. Whitespace is allowed between attributes and before the > of the tag.

When the prescan a byte stream to determine its encoding algorithm says to get an attribute, it means doing this:

If the byte at position is one of 0x09 (HT), 0x0A (LF), 0x0C (FF), 0x0D (CR), 0x20 (SP), or 0x2F (/) then advance position to the next byte and redo this step.

If the byte at position is 0x3E (>), then abort the get an attribute algorithm. There isn't one.

https://html.spec.whatwg.org/multipage/parsing.html#concept-get-attributes-when-sniffing

The missing end tags are another error, and recovery rules inserts them when the end tag for the paragraph is reached.

When the steps above say the user agent is to close a p element, it means that the user agent must run the following steps:

  1. Generate implied end tags, except for p elements.
  2. If the current node is not a p element, then this is a parse error.
  3. Pop elements from the stack of open elements until a p element has been popped from the stack.

https://html.spec.whatwg.org/multipage/parsing.html#close-a-p-element

A normalised version of the HTML is:

<p>
    Span<span>in<span>the<span>place<span>where<span>you<span>live.
</span></span></span></span></span></span></p>
Quentin
  • 914,110
  • 126
  • 1,211
  • 1,335