|
Posted by Holger Jeromin on June 5, 2008, 10:39 am
Please log in for more thread options
Hello,
Note: this is a IE 6,7 and 8b1 only html example, my problem does not
appear in other browsers with native svg support. For them i have a
working valid "XHTML 1.1 plus MathML 2.0 plus SVG 1.1" Version :-)
I have an svg element embedded into a html.
Sadly the global definition in <svg:style type="text/css"> is not
overwritten by the special style attributes of the circle and polyline
elements:
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:svg="http://www.w3.org/2000/svg" xml:lang="en">
<head>
<meta http-equiv="Content-Style-Type" content="text/css">
<title>SVG CSS Test</title>
<object id="AdobeSVG"
classid="clsid:78156a80-c6a1-4bbf-8e6a-3cd390eeb4e2">
</object>
<?import namespace="svg" implementation="#AdobeSVG"?>
</head>
<body>
<p id="playground">
<svg:svg xmlns:svg="http://www.w3.org/2000/svg" x="0" y="0" height="200"
width="200" layerX="0" layerY="0">
<svg:style xmlns:svg="http://www.w3.org/2000/svg" type="text/css">
* {stroke:blue;fill: red;overflow: visible;}
</svg:style>
<svg:svg xmlns:svg="http://www.w3.org/2000/svg" x="30" y="30"
height="60" width="60">
<svg:circle cx="30" cy="30" r="30" style="fill: green;overflow:
visible;"/>
<svg:polyline points="60,30 30,60 0,30" style="fill:none; stroke:
yellow;stroke-width:3px;"/>
</svg:svg>
</svg:svg>
</p>
</body>
</html>
The circle should be filled green, the stroke of the polyline yellow.
Dropping the <svg:style type="text/css"> results in a fall back to the
default values of fill (black) and stroke (none), with is not a solution
either.
In reality i get a string of the svg with ajax and import this to the
DOM. So it would be best if there is an easy automated way to change the
SVG to be displayed as in opera/firefox.
--
best regards
Holger Jeromin
| 
XML Sitemap