A question on span style and br tags

When at the source code I write the <span style=""> stuff and then only close it after <br /> tags, the span style stuff disappears and there is no formatting.
Is this supposed to happen?

Example:
This is common stuff, but <span style="color: #ff0000;"><br />this should be red</span> stuff...

I'm not a connoisseur of HTML and CSS but I would just accept it as a little quirk and work around it.

Unless something has changed with HTML recently, it's not a quirk.

span is an inline element and br is a block element; inline elements may not contain block level elements ... use a div instead.

In chrome your example works just fine, and it's actually allowed to have block elements within inline elements. From the spec:

"When an inline box contains a block box, the inline box (and its inline ancestors within the same line box) are broken around the block. The line boxes before the break and after the break are enclosed in anonymous boxes, and the block box becomes a sibling of those anonymous boxes."

So it's odd that it doesn't work for you, it's not like it's a cutting edge new spec or anything. But yeah, just work around it. Browsers often vary in implementation. It's annoying, but there's nothing you can do about it.

The spec you referenced actually refers to block and inline content nested within another block element; furthermore, it covers CSS, not HTML. There is a difference between CSS display:block/display:inline and HTML elements that are defined to be block or inline.

The distinction between block level and inline elements existed until HTML5, in which there have indeed been major fundamental changes.

For versions of HTML prior to 5, it is both semantically and syntactically invalid to contain block level elements within inline elements.  That's in the spec - search for "Content Model". Otherwise, there would be no point in having separate div and span tags - div alone would be sufficient.

However, I agree with MikeVeenema in that I would expect most browsers to work around such an error, and that they would just display it as intended in any case, but as you add more and more complexity past the simplest case, the possibility of breakage increases.

 In HTML5, changes in the content model have resulted in distinctions that are far more complex. Although it is still invalid to contain most formerly block level elements inside a span tag, the br element has been defined as phrasing content, and the span element is specifically intended to contain phrasing content. Oddly, the changes mean that spans may no longer be nested in HTML5 (spans are flow content, and spans may not contain flow content).

Bottom line, if you are using a version of HTML prior to 5, it is semantically and syntactically invalid to place a br element inside of a span element. If your document is defined to be an HTML 5 document, then it is neither semantically nor syntactically invalid.

Thanks guys!
I'll work around it then.