Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

Design

Stuck on Responsive design including svg file

The video poorly explains how to insert an object like an .svg file. The challenge quiz keeps giving me coding errors, I copied what I saw from the video save for the requested file name swamped for the one they provided in the challenge.

looking to basically call up an .svg file instead of a img file. Anyone have some insight on how to do link an object?

4 Answers

James Barnett
James Barnett
39,199 Points

SVGs aren't like normal images, here's an example of the correct syntax to embed an svg.

It's basically 3 parts

  • type which is always image/svg+xml
  • data, works the same as the src property on the <img> tag
  • wrap those in a set of <object> tags

Here's an example, include an svg image named apple.svg located in the folder images.

<object type="image/svg+xml" data="images/apple.svg"></object>

J.T. Gralka
J.T. Gralka
20,126 Points

Jonathan,

Can you share the HTML you've tried for this code challenge with us?

Cheers,

J.T.

Ah yes! Thanks James, I should have assumed the <object> tag was a wrap and not self closing, I've just never seen it before. That is my problem, no closing tag.

Cheers!

Hunter MacDermut
Hunter MacDermut
15,865 Points

I agree that this video does a poor job of teaching this concept. Thank you James for the clarification.