By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
424,949 Members | 1,302 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 424,949 IT Pros & Developers. It's quick & easy.

svg image misbehavior on IE?

P: n/a
Hello. On one webpage I just worked out, I use svg (by using <object>)
for browser that supports svg (firefox), and give an <imginside of
<objectas a fallback for IE.

http://www.realss.com/workshop/061107

The page looks differently between Fx and IE.

On Fx it's the correct look.

On IE, the object block should faile (IE don't suport svg)
[codesnip1]
<object type="image/svg+xml" width="310" height="70"
style="float: left; background-color: white"
data="http://www.realss.cn/logos/scalable_logo_quarter.svg" >
<img src="http://www.realss.cn/logos/weblogo_quarter.png"
alt="Real Softservice Logo" />
</object>
[/codesnip1]

However, the browser does not correctly fallback. If I replace the
above <objectsection with this
[codesnip2]
<img src="http://www.realss.cn/logos/weblogo_quarter.png"
style="float: left; background-color: white"
alt="Real Softservice Logo" />
[/codesnip2]

Then for IE the page look OK.

Question: for IE if svg is not understood, codesnip1 and codesnip2
should look the same, now they are not.
Is it possible to make IE render the page correctly, without having to
fall back to not to use svg at all? (for that particular page there is
no lose if I completely don't use svg, but I am just curious if it's
possible to still using svg, e.g. in case we used an animated logo and
then we wish to preserve the svg movie for browsers that supports it)

Oct 11 '06 #1
Share this Question
Share on Google+
1 Reply


P: n/a
Wed, 11 Oct 2006 02:14:35 -0700Zhang Weiwuд
Hello. On one webpage I just worked out, I use svg (by using <object>)
for browser that supports svg (firefox), and give an <imginside of
<objectas a fallback for IE.

http://www.realss.com/workshop/061107

The page looks differently between Fx and IE.

On Fx it's the correct look.

On IE, the object block should faile (IE don't suport svg)
[codesnip1]
<object type="image/svg+xml" width="310" height="70"
style="float: left; background-color: white"
data="http://www.realss.cn/logos/scalable_logo_quarter.svg" >
<img src="http://www.realss.cn/logos/weblogo_quarter.png"
alt="Real Softservice Logo" />
</object>
[/codesnip1]

However, the browser does not correctly fallback. If I replace the
above <objectsection with this
[codesnip2]
<img src="http://www.realss.cn/logos/weblogo_quarter.png"
style="float: left; background-color: white"
alt="Real Softservice Logo" />
[/codesnip2]

Then for IE the page look OK.

Question: for IE if svg is not understood, codesnip1 and codesnip2
should look the same, now they are not.
Is it possible to make IE render the page correctly, without having to
fall back to not to use svg at all? (for that particular page there is
no lose if I completely don't use svg, but I am just curious if it's
possible to still using svg, e.g. in case we used an animated logo and
then we wish to preserve the svg movie for browsers that supports it)
This problem is cross-posted on comp.infosystems.www.authoring.stylesheet
and Spartanicus kindly answered it. It seems this is more of a css
question then HTML question, so I posted in the wrong group.

The workaround to this IE issue is to wrap a div around <objecttag and
apply style to <divinstead.
Oct 18 '06 #2

This discussion thread is closed

Replies have been disabled for this discussion.