On Tue, May 11, 2021 at 5:59 PM Larry Martell <larry.mart...@gmail.com> wrote: > > On Tue, May 11, 2021 at 5:41 PM Philippe Wittenbergh <ph...@l-c-n.com> wrote: > > > > > > > > > On May 12, 2021, at 9:21, Larry Martell <larry.mart...@gmail.com> wrote: > > > > > > .observations li::before { > > > background-image:url("data:image/svg+xml;utf8,<svg > > > xmlns='http://www.w3.org/2000/svg' stroke='null' fill='#1aaf54' <path > > > d='m0.20231,4.976169c0,-2.655359 2.138654,-4.804042 > > > 4.78162,-4.804042c2.641807,0 4.78162,2.148683 > > > 4.78162,4.804042s-2.139812,4.804042 -4.78162,4.804042c-2.642947,0 > > > -4.78162,-2.148683 -4.78162,-4.804042z' /> </svg>"); > > > } > > > > The opening `<svg` is missing the closing angled bracket `>` > > > > <svg xmlns='http://www.w3.org/2000/svg' fill='#1aaf54'> <path > > d='m0.20231,4.976169c0,-2.655359 2.138654,-4.804042 > > 4.78162,-4.804042c2.641807,0 4.78162,2.148683 > > 4.78162,4.804042s-2.139812,4.804042 -4.78162,4.804042c-2.642947,0 > > -4.78162,-2.148683 -4.78162,-4.804042z' /></svg> > > > > > > For maximum compatibility, you are better url encode parts for use in data > > URI > > * make sure you use single quotation marks inside the SVG (you are doing > > that already > > * replace all instances of: > > < with %3C > > > with %3E > > # with %23 > > & with %26 > > { with %7B > > } with %7D > > % with %25 > > > > (a little bit less readable, but still easy to edit. base64 is bloat.) > > Thanks for the reply. Added the closing >, but still no circles are > displaying.
I got this working. This is a django app, and here is the template that works: <ul style="padding-left: 20px; list-style-type:none;"> {% for y in x.10 %} <li style="line-height: 1.25;"> <svg xmlns="http://www.w3.org/2000/svg" fill="{{COLORS|get_color:y.1}}" style="width: 30px; height: 10px;"> <path d='m0.20231,4.976169c0,-2.655359 2.138654,-4.804042 4.78162,-4.804042c2.641807,0 4.78162,2.148683 4.78162,4.804042s-2.139812,4.804042 -4.78162,4.804042c-2.642947,0 -4.78162,-2.148683 -4.78162,-4.804042z' /> </svg> <span style="color: black;">{{y.0}}</span> </li> {% endfor %} </ul> ______________________________________________________________________ css-discuss [css-d@css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/