Timeline for How to style SVG with external CSS?
Current License: CC BY-SA 4.0
12 events
| when toggle format | what | by | license | comment | |
|---|---|---|---|---|---|
| Feb 19 at 20:48 | history | edited | Volker E. | CC BY-SA 4.0 |
Fix writing case
|
| Aug 3, 2023 at 0:29 | comment | added | Matthias Braun |
If your SVG doesn't show up, it might be because the SVG might be missing a viewBox. This fixed it for me: <svg viewBox="0 0 780 540" class="fill-red"> See also this.
|
|
| Sep 9, 2022 at 22:52 | comment | added | anroesti |
xlink:href is now depreacated. Use href instead (optionally with xlink:href as a fallback).
|
|
| S Jun 12, 2022 at 13:59 | history | edited | Wenfang Du | CC BY-SA 4.0 |
Adding a missing quotation mark that changed the coloring
|
| S Jun 12, 2022 at 13:59 | history | suggested | JoshGC | CC BY-SA 4.0 |
Adding a missing quotation mark that changed the coloring
|
| Jun 9, 2022 at 18:20 | review | Suggested edits | |||
| S Jun 12, 2022 at 13:59 | |||||
| Apr 19, 2019 at 11:06 | review | Suggested edits | |||
| Apr 19, 2019 at 14:00 | |||||
| Apr 19, 2019 at 10:58 | comment | added | SimoneMSR |
This is a solution! Actually there is no need to wrap the whole svg content in a symbol element, i.e. you can just give an id to the svg element, so: ` <svg id=example" xmlns="w3.org/2000/svg" viewBox="0 0 256 256"> <path class="background" d="M120..." /> <path class="icon" style="fill: white;" d="M20..." /> </svg> `
|
|
| Jun 18, 2015 at 7:27 | comment | added | ptim | good answer.. i think the caveat should really be: Browser Support, though! good reference (more detail than caniuse): css-tricks.com/svg-fragment-identifiers-work | |
| Oct 13, 2014 at 20:41 | review | Late answers | |||
| Oct 13, 2014 at 20:44 | |||||
| Oct 13, 2014 at 20:18 | review | First posts | |||
| Oct 13, 2014 at 20:22 | |||||
| Oct 13, 2014 at 20:18 | history | answered | Adam Korman | CC BY-SA 3.0 |