Why does firefox change align="center" to align="middle"?

Question

I know that img.align is deprecated or even obsolete, still ... Firefox is changing the values of my attributes. In particular see example

const img = document.querySelector("img");
console.log("img.align:", img.align);

<img src="http://www.gravatar.com/avatar" align="center" >

results:

• chrome: img.align: center
• firefox: img.align: middle

Any idea why firefox changes the value of the attribute? Are there other attribute values firefox changes?

This has implications for code like

document.querySelectorAll("img[align=center]")

Which fails on Firefox (only) and so would any CSS using the same selector; img[align=center] { ... }, for example.

Possibly relevant: Can I add custom attribute to HTML tag?

Answer 1

Any idea why firefox changes the value of the attribute?

Because middle is the correct value as defined in RFC 1866 (HTML 2.0), HTML 3.2 and HTML 4, not center. The align attribute on the img element has never had center as a possible value, because center has historically always referred to horizontal alignment (floating), and you can't float an image at the center of a line. Other implementations at the time, such as IE, did allow center as a possible value with the same meaning as middle (see Stefan's answer), and so my guess is that Firefox is providing interop while still adhering to the standard by aliasing the values.

It's not clear to me why Chrome doesn't do the same. It does seem to treat center as middle for the purposes of rendering, in any case. But if by rewriting the value Firefox is breaking attribute selectors, I'd consider that a defect (albeit one they probably aren't inclined to fix since the attribute is obsolete).

The real question is why MDN claims that the only possible values are left, right, justify, and center. The DOM level 2 spec, of course, contains a more accurate description of the align attribute, though it doesn't list the possible values since they're already listed in the HTML spec.

Answer 2

the html specification does not know of a value center for the align attribute for img tags (but for other tags). however, firefox probably recognizes center as value (instead of other nonsense) and accepts it as middle since firefox and possible other browsers have done this at some point in their life according to this rather ancient bug report