Skip to content

Instantly share code, notes, and snippets.

@keyz

keyz/index.html

Last active April 9, 2016 19:55
Show Gist options
  • Save keyz/cbaff654eecd5c04f278df71d40cc2bc to your computer and use it in GitHub Desktop.
Save keyz/cbaff654eecd5c04f278df71d40cc2bc to your computer and use it in GitHub Desktop.
Download ZIP
`body` in `foreignObject` is invalid
Raw
index.html
<!DOCTYPE html>
<head>
<title>Awesome page title</title>
</head>
<body>
<!-- taken from https://developer.mozilla.org/en-US/docs/Web/SVG/Element/foreignObject -->
<!-- pass this snippet to https://validator.w3.org/ to see the result -->
<svg width="400px" height="300px" viewBox="0 0 400 300"
xmlns="http://www.w3.org/2000/svg">
<desc>This example uses the 'switch' element to provide a
fallback graphical representation of a paragraph, if
XHTML is not supported.</desc>
<!-- The 'switch' element will process the first child element
whose testing attributes evaluate to true.-->
<switch>
<!-- Process the embedded XHTML if the requiredExtensions attribute
evaluates to true (i.e., the user agent supports XHTML
embedded within SVG). -->
<foreignObject width="100" height="50"
requiredExtensions="http://www.w3.org/1999/xhtml">
<!-- XHTML content goes here -->
<body xmlns="http://www.w3.org/1999/xhtml">
<p>Here is a paragraph that requires word wrap</p>
</body>
</foreignObject>
<!-- Else, process the following alternate SVG.
Note that there are no testing attributes on the 'text' element.
If no testing attributes are provided, it is as if there
were testing attributes and they evaluated to true.-->
<text font-size="10" font-family="Verdana">
<tspan x="10" y="10">Here is a paragraph that</tspan>
<tspan x="10" y="20">requires word wrap.</tspan>
</text>
</switch>
</svg>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment