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 trialDIJITUL UK
17,246 PointsNo responsive check box when saving as SVG?
At first I thought it was because we are using different versions of Illustrator, but after previewing it in the browser, it simply acts like a normal image.
How do I get this button to appear? I'm on CS6
3 Answers
elk6
22,916 PointsHi Olly,
This option isn't in CS6, unfortunately.
I've seen more options in this course that are only there in CC. They might have added that.
Fortunately, it's still just an svg, so it will be scalable and you can make it responsive with your css.
- Elian
Elena Paraschiv
9,938 PointsCan you give an example Elian Kloppenburg of how you would make the SvG responsive with CSS ?
elk6
22,916 PointsSure. If you save it as an SVG ( not inline svg, so just an image and no code ) you can do the same as any other image. Just use:
img {
width: 100%;
height: auto;
}
If you are using inline SVG wrap it in a div with a class. Give the SVG an aspectratio after the viewbox and style it with some css.
Take a look at this codepen I made with a responsive inline SVG: http://codepen.io/McSuckelaer/pen/RrJWgj
Elena Paraschiv
9,938 PointsThanks buddy!
DIJITUL UK
17,246 PointsDIJITUL UK
17,246 PointsThank you for the quick reply :)