Background

After I’d written Added W3C Validated Logos to Some Pages, I saw that in the site, there’s still two pages which hadn’t been checked by the W3C’s validators.

Problem

To allow SVG fallbacks to text, I viewed the source code for the SVG example from W3Schools. The fallback message was simply included inside a <svg> tag just like a <p> tag. I applied this technique to source/downloads/code/SVGViewBox/viewBox1.html.

Then I uploaded that HTML file to the W3C’s HTML validator, which complained such an inclusion of text.

Solution

After that, I googled “svg fallback text” using the encrypted version of the search engine. Luckily, the second answer to the Stack Overflow question, which appeared at the top of the list of search results, is useful.

Lessons learnt

To get an HTML page which consists of a <foreignObject> tag inside an <svg> tag validated by the W3C HTML validator, it’s obligatory to specify the dimensions of the <foreignObject> tag.