[whatwg] HTML spec incorrectly suggests that <br> can have its rendering changed with CSS

[Daniel Holbert]

Note: part of the motivation for this concern is that the CSS Flexbox
spec likely needs a bit of tweaking to indicate how <br> elements in
runs of raw text should be handled, as I noted in this post to www-style:
  http://lists.w3.org/Archives/Public/www-style/2014Jan/0317.html
...and the new spec text there may likely be impacted by how <br> itself
is specced.

~Daniel

On 01/22/2014 01:51 PM, Daniel Holbert wrote:
> Hi folks,
> 
> Boris Zbarsky and I ran across a "not reflecting reality" issue in the
> WHATWG HTML spec.
> 
> The spec currently defines the rendering of the <br> element as follows:
>  # br { content: '\A'; white-space: pre; }
> Source:
> http://www.whatwg.org/specs/web-apps/current-work/multipage/rendering.html#phrasing-content-1
> 
> This CSS implies that <br>'s rendering could be customized by CSS, which
> in practice (in the browsers that I tested[1]) is not actually the case.
> 
> In particular: given the spec's CSS quoted above, you might expect that
> perhaps an author could set...
>    "white-space: nowrap"
> ... on a <br> element, to neuter the linebreak. That doesn't work,
> though -- the <br> still triggers a linebreak. Similarly, you might also
> expect to be able to customize the 'display' or 'height'/'width' or
> 'background' properties, but in practice, none of those have any effect
> on <br> in modern browsers.
> 
> So: to reflect reality, it might be better to specify <br> in a way that
> doesn't suggest it's as customizable with CSS. (for the "white-space"
> property in particular, but probably others as well)
> 
> For reference, here's a page with a few testcases:
>   http://people.mozilla.org/~dholbert/tests/br-tests.html
> The browsers that I tested[1] all agree on the rendering (basically, not
> honoring any of the <br> styling), with one minor exception[2].
> 
> Thanks,
> ~Daniel
> 
> [1] I tested the following browsers:
>  Firefox 26
>  Opera 12.16
>  Chrome 34.0.1788.0 dev
>  IE 11
> 
> [2] I only noticed one rendering difference -- IE11 honors "border" on
> <br>, unlike the other browsers that I tested. (It still doesn't honor
> e.g. "display"/"width"/"height", though.)
>