Re: [css-d] Style Object tag svg

[Crest Christopher]

> Crest Christopher 
> Thursday, July 14, 2016 10:23 AM
> Following the jQuery method, I assume I can keep the  tag ?
>
> The SVG loads via the  tag, then though the help of the
> script, I stylize the classes within the SVG as such
>
> |#word.pavement .ab {
>  fill:red;
>  rotate(12deg);
> }
> |
> The class .ab is within the SVG file ?
>
>
> Rick Gordon 
> Thursday, July 14, 2016 12:20 AM
> The link that I posted earlier,
> http://stackoverflow.com/questions/18434094/how-to-style-svg-with-external-css,
> suggests inlining the SVG. Is that a possibility?
>
> Here's a direct link to what was pointed to:
>
> https://snippetlib.com/jquery/replace_all_svg_images_with_inline_svg
>
> Rick Gordon
>
> -
>
>
> ___
> RICK GORDON
> EMERALD VALLEY GRAPHICS AND CONSULTING
> ___
> WWW: http://www.shelterpub.com
> __
> css-discuss [css-d@lists.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/
> Crest Christopher 
> Wednesday, July 13, 2016 11:01 PM
> Here is an example pen ; the SVG
> is being loaded externally, absolute path in this case.  There are
> classes for each path within the SVG, I want to stylize the classes
> individually within the SVG, not just fill the classes with a path. 
>
> Many of you have posted some good links, even if I've read them, none
> appear from my understanding to stylize classes from outside the SVG;
> I hopefully want to keep SVG separate from CSS, not intermix the two
> together within the SVG file.
>
>
> Tom Livingston 
> Wednesday, July 13, 2016 4:55 PM
> Updated again. Sorry. My mistake. Just the class is working.
> (I had left the style embedded inside the svg, so using "circle.st0" was
> just more specific.)
>
> Tom Livingston 
> Wednesday, July 13, 2016 4:50 PM
> Updated to style the circles as well. Have to specify "circle.st0" for
> this
> to work in chrome. Just the class didn't seem to work.
>
>
>

__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Karl DeSaulniers]

Um I didn't ask a question, but I am glad you figured it out.

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com




> On Jul 14, 2016, at 8:37 AM, Crest Christopher  
> wrote:
> 
> You can, you answered your own question, what I already found out.

__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Crest Christopher]

Following the jQuery method, I assume I can keep the  tag ?

The SVG loads via the  tag, then though the help of the
script, I stylize the classes within the SVG as such

|#word.pavement .ab {
 fill:red;
 rotate(12deg);
}
|
The class .ab is within the SVG file ?

> Rick Gordon 
> Thursday, July 14, 2016 12:20 AM
> The link that I posted earlier,
> http://stackoverflow.com/questions/18434094/how-to-style-svg-with-external-css,
> suggests inlining the SVG. Is that a possibility?
>
> Here's a direct link to what was pointed to:
>
> https://snippetlib.com/jquery/replace_all_svg_images_with_inline_svg
>
> Rick Gordon
>
> -
>
>
> ___
> RICK GORDON
> EMERALD VALLEY GRAPHICS AND CONSULTING
> ___
> WWW: http://www.shelterpub.com
> __
> css-discuss [css-d@lists.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/
> Crest Christopher 
> Wednesday, July 13, 2016 11:01 PM
> Here is an example pen ; the SVG
> is being loaded externally, absolute path in this case.  There are
> classes for each path within the SVG, I want to stylize the classes
> individually within the SVG, not just fill the classes with a path. 
>
> Many of you have posted some good links, even if I've read them, none
> appear from my understanding to stylize classes from outside the SVG;
> I hopefully want to keep SVG separate from CSS, not intermix the two
> together within the SVG file.
>
>
> Tom Livingston 
> Wednesday, July 13, 2016 4:55 PM
> Updated again. Sorry. My mistake. Just the class is working.
> (I had left the style embedded inside the svg, so using "circle.st0" was
> just more specific.)
>
> Tom Livingston 
> Wednesday, July 13, 2016 4:50 PM
> Updated to style the circles as well. Have to specify "circle.st0" for
> this
> to work in chrome. Just the class didn't seem to work.
>
>
>
> Tom Livingston 
> Wednesday, July 13, 2016 4:34 PM
> It's pretty easy. Blue is done with css in the head.
>
> http://tomliv.com/svg/
>
>

__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Crest Christopher]

> So to answer your question, can you style a SVGs children via the
> parent documents css that are linked and not embedded, the answer is no.
You can, you answered your own question, what I already found out.
> I think the reason jQuery can do it is because jQuery accesses the
> inline  tag after its been loaded into the DOM.


> Karl DeSaulniers 
> Thursday, July 14, 2016 1:23 AM
> I think the reason jQuery can do it is because jQuery accesses the
> inline  tag after its been loaded into the DOM.
>
> So to answer your question, can you style a SVGs children via the
> parent documents css that are linked and not embedded, the answer is no.
>
> Best,
>
> Karl DeSaulniers
> Design Drumm
> http://designdrumm.com
>
>
>
>
>
> __
> css-discuss [css-d@lists.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/
> Karl DeSaulniers 
> Thursday, July 14, 2016 1:20 AM
> Also, you will need to include the "embed tag" like you do with a
> flash file for it to work on all systems I believe.
> So one suggestion I have is to put your SVG inline code in their own
> separate html and inject them at runtime into your object and embed
> tags with PHP or the like.
> IF you really want to control them with the parent css.
>
> The easiest way seems to be to use the style tag inside the SVG.
> I am not sure how to access that when creating your SVG. Hadn't gone
> that far.
>
> GL!
>
> Best,
>
> Karl DeSaulniers
> Design Drumm
> http://designdrumm.com
>
>
>
>
>
> __
> css-discuss [css-d@lists.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/
> Karl DeSaulniers 
> Thursday, July 14, 2016 1:13 AM
> Crest,
> Your main css would only have an effect on the content of the SVG if
> the SVG file is included inline in the HTML.
> If you want to keep your SVG in files, the CSS needs to be defined
> inside of the SVG file.
> You can do it with a style tag that is inside the SVG.
>
>
> Otherwise you have to put the code for the svg inside the object tag
> if you want control of styling it via the parent css.
>
> IE:
>
> 
>
> http://www.w3.org/2000/svg; id="Layer_1" data-name="Layer
> 1" viewBox="0 0 600.65 19.96">
> 
>
> 

Re: [css-d] Style Object tag svg

[Karl DeSaulniers]

FYI, I found this answer using Rick Gordons link — 
http://stackoverflow.com/questions/18434094/how-to-style-svg-with-external-css

The answer by RGB edited by Paul D. Waite

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com




> On Jul 14, 2016, at 12:23 AM, Karl DeSaulniers  wrote:
> 
> I think the reason jQuery can do it is because jQuery accesses the inline 
>  tag after its been loaded into the DOM.
> 
> So to answer your question, can you style a SVGs children via the parent 
> documents css that are linked and not embedded, the answer is no.
> 
> Best,
> 
> Karl DeSaulniers
> Design Drumm
> http://designdrumm.com
> 
> 
> 
> 
>> On Jul 14, 2016, at 12:20 AM, Karl DeSaulniers  wrote:
>> 
>> Also, you will need to include the "embed tag" like you do with a flash file 
>> for it to work on all systems I believe. 
>> So one suggestion I have is to put your SVG inline code in their own 
>> separate html and inject them at runtime into your object and embed tags 
>> with PHP or the like.
>> IF you really want to control them with the parent css.
>> 
>> The easiest way seems to be to use the style tag inside the SVG. 
>> I am not sure how to access that when creating your SVG. Hadn't gone that 
>> far.
>> 
>> GL!
>> 
>> Best,
>> 
>> Karl DeSaulniers
>> Design Drumm
>> http://designdrumm.com
>> 
>> 
>> 
>> 
>>> On Jul 14, 2016, at 12:13 AM, Karl DeSaulniers  wrote:
>>> 
>>> Crest,
>>> Your main css would only have an effect on the content of the SVG if the 
>>> SVG file is included inline in the HTML.
>>> If you want to keep your SVG in files, the CSS needs to be defined inside 
>>> of the SVG file.
>>> You can do it with a style tag that is inside the SVG.
>>> 
>>> 
>>> Otherwise you have to put the code for the svg inside the object tag if you 
>>> want control of styling it via the parent css.
>>> 
>>> IE:
>>> 
>>> 
>>> 
>>> http://www.w3.org/2000/svg; id="Layer_1" data-name="Layer 1" 
>>> viewBox="0 0 600.65 19.96">
>>> 
>>> 
>>> 

Re: [css-d] Style Object tag svg

[Karl DeSaulniers]

I think the reason jQuery can do it is because jQuery accesses the inline  
tag after its been loaded into the DOM.

So to answer your question, can you style a SVGs children via the parent 
documents css that are linked and not embedded, the answer is no.

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com




> On Jul 14, 2016, at 12:20 AM, Karl DeSaulniers  wrote:
> 
> Also, you will need to include the "embed tag" like you do with a flash file 
> for it to work on all systems I believe. 
> So one suggestion I have is to put your SVG inline code in their own separate 
> html and inject them at runtime into your object and embed tags with PHP or 
> the like.
> IF you really want to control them with the parent css.
> 
> The easiest way seems to be to use the style tag inside the SVG. 
> I am not sure how to access that when creating your SVG. Hadn't gone that far.
> 
> GL!
> 
> Best,
> 
> Karl DeSaulniers
> Design Drumm
> http://designdrumm.com
> 
> 
> 
> 
>> On Jul 14, 2016, at 12:13 AM, Karl DeSaulniers  wrote:
>> 
>> Crest,
>> Your main css would only have an effect on the content of the SVG if the SVG 
>> file is included inline in the HTML.
>> If you want to keep your SVG in files, the CSS needs to be defined inside of 
>> the SVG file.
>> You can do it with a style tag that is inside the SVG.
>> 
>> 
>> Otherwise you have to put the code for the svg inside the object tag if you 
>> want control of styling it via the parent css.
>> 
>> IE:
>> 
>> 
>> 
>> http://www.w3.org/2000/svg; id="Layer_1" data-name="Layer 1" 
>> viewBox="0 0 600.65 19.96">
>> 
>> 
>> 

Re: [css-d] Style Object tag svg

[Karl DeSaulniers]

Also, you will need to include the "embed tag" like you do with a flash file 
for it to work on all systems I believe. 
So one suggestion I have is to put your SVG inline code in their own separate 
html and inject them at runtime into your object and embed tags with PHP or the 
like.
IF you really want to control them with the parent css.

The easiest way seems to be to use the style tag inside the SVG. 
I am not sure how to access that when creating your SVG. Hadn't gone that far.

GL!

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com




> On Jul 14, 2016, at 12:13 AM, Karl DeSaulniers  wrote:
> 
> Crest,
> Your main css would only have an effect on the content of the SVG if the SVG 
> file is included inline in the HTML.
> If you want to keep your SVG in files, the CSS needs to be defined inside of 
> the SVG file.
> You can do it with a style tag that is inside the SVG.
> 
> 
> Otherwise you have to put the code for the svg inside the object tag if you 
> want control of styling it via the parent css.
> 
> IE:
> 
> 
> 
> http://www.w3.org/2000/svg; id="Layer_1" data-name="Layer 1" 
> viewBox="0 0 600.65 19.96">
> 
> 
> 

Re: [css-d] Style Object tag svg

[Karl DeSaulniers]

Crest,
Your main css would only have an effect on the content of the SVG if the SVG 
file is included inline in the HTML.
If you want to keep your SVG in files, the CSS needs to be defined inside of 
the SVG file.
You can do it with a style tag that is inside the SVG.


Otherwise you have to put the code for the svg inside the object tag if you 
want control of styling it via the parent css.

IE:



http://www.w3.org/2000/svg; id="Layer_1" data-name="Layer 1" 
viewBox="0 0 600.65 19.96">

Re: [css-d] Style Object tag svg

[Crest Christopher]

I did get your link a few posts back. I suppose jQuery is the only
solution, otherwise vanilla css and svg segregated is not possible.

Thanks Rick.

> Rick Gordon 
> Thursday, July 14, 2016 12:20 AM
> The link that I posted earlier,
> http://stackoverflow.com/questions/18434094/how-to-style-svg-with-external-css,
> suggests inlining the SVG. Is that a possibility?
>
> Here's a direct link to what was pointed to:
>
> https://snippetlib.com/jquery/replace_all_svg_images_with_inline_svg
>
> Rick Gordon
>
> -
>
>
> ___
> RICK GORDON
> EMERALD VALLEY GRAPHICS AND CONSULTING
> ___
> WWW: http://www.shelterpub.com
> __
> css-discuss [css-d@lists.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/
> Crest Christopher 
> Wednesday, July 13, 2016 11:01 PM
> Here is an example pen ; the SVG
> is being loaded externally, absolute path in this case.  There are
> classes for each path within the SVG, I want to stylize the classes
> individually within the SVG, not just fill the classes with a path. 
>
> Many of you have posted some good links, even if I've read them, none
> appear from my understanding to stylize classes from outside the SVG;
> I hopefully want to keep SVG separate from CSS, not intermix the two
> together within the SVG file.
>
>
> Tom Livingston 
> Wednesday, July 13, 2016 4:55 PM
> Updated again. Sorry. My mistake. Just the class is working.
> (I had left the style embedded inside the svg, so using "circle.st0" was
> just more specific.)
>
> Tom Livingston 
> Wednesday, July 13, 2016 4:50 PM
> Updated to style the circles as well. Have to specify "circle.st0" for
> this
> to work in chrome. Just the class didn't seem to work.
>
>
>
> Tom Livingston 
> Wednesday, July 13, 2016 4:34 PM
> It's pretty easy. Blue is done with css in the head.
>
> http://tomliv.com/svg/
>
>

__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Crest Christopher]

Here is an example pen ; the SVG is 
being loaded externally, absolute path in this case.  There are classes 
for each path within the SVG, I want to stylize the classes individually 
within the SVG, not just fill the classes with a path.


Many of you have posted some good links, even if I've read them, none 
appear from my understanding to stylize classes from outside the SVG; I 
hopefully want to keep SVG separate from CSS, not intermix the two 
together within the SVG file.



Tom Livingston 
Wednesday, July 13, 2016 4:55 PM
Updated again. Sorry. My mistake. Just the class is working.
(I had left the style embedded inside the svg, so using "circle.st0" was
just more specific.)

Tom Livingston 
Wednesday, July 13, 2016 4:50 PM
Updated to style the circles as well. Have to specify "circle.st0" for 
this

to work in chrome. Just the class didn't seem to work.



Tom Livingston 
Wednesday, July 13, 2016 4:34 PM
It's pretty easy. Blue is done with css in the head.

http://tomliv.com/svg/


Tom Livingston 
Wednesday, July 13, 2016 4:18 PM

As opposed to adding an svg using 



Tom Livingston 
Wednesday, July 13, 2016 4:17 PM
On Wed, Jul 13, 2016 at 3:10 PM, Crest Christopher <

He's loading an svg by putting the svg code in the html and providing a
method of falling back to a png. He is styling the svg with css.





__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Crest Christopher]

Anyone know if CodePen can display absolute SVG files, I'm getting a 
parsing error ?



Tom Livingston 
Wednesday, July 13, 2016 4:55 PM
Updated again. Sorry. My mistake. Just the class is working.
(I had left the style embedded inside the svg, so using "circle.st0" was
just more specific.)

Tom Livingston 
Wednesday, July 13, 2016 4:50 PM
Updated to style the circles as well. Have to specify "circle.st0" for 
this

to work in chrome. Just the class didn't seem to work.



Tom Livingston 
Wednesday, July 13, 2016 4:34 PM
It's pretty easy. Blue is done with css in the head.

http://tomliv.com/svg/


Tom Livingston 
Wednesday, July 13, 2016 4:18 PM

As opposed to adding an svg using 



Tom Livingston 
Wednesday, July 13, 2016 4:17 PM
On Wed, Jul 13, 2016 at 3:10 PM, Crest Christopher <

He's loading an svg by putting the svg code in the html and providing a
method of falling back to a png. He is styling the svg with css.





__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Crest Christopher]

It requires the SVG to be embedded into the markup; I suppose id> is my only solution.  I have SVG with too many paths that will add 
too much overhead to the markup.



Tom Livingston 
Wednesday, July 13, 2016 4:55 PM
Updated again. Sorry. My mistake. Just the class is working.
(I had left the style embedded inside the svg, so using "circle.st0" was
just more specific.)

Tom Livingston 
Wednesday, July 13, 2016 4:50 PM
Updated to style the circles as well. Have to specify "circle.st0" for 
this

to work in chrome. Just the class didn't seem to work.



Tom Livingston 
Wednesday, July 13, 2016 4:34 PM
It's pretty easy. Blue is done with css in the head.

http://tomliv.com/svg/


Tom Livingston 
Wednesday, July 13, 2016 4:18 PM

As opposed to adding an svg using 



Tom Livingston 
Wednesday, July 13, 2016 4:17 PM
On Wed, Jul 13, 2016 at 3:10 PM, Crest Christopher <

He's loading an svg by putting the svg code in the html and providing a
method of falling back to a png. He is styling the svg with css.





__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Tom Livingston]

On Wed, Jul 13, 2016 at 4:50 PM, Tom Livingston  wrote:

>
>
> On Wed, Jul 13, 2016 at 4:34 PM, Tom Livingston  wrote:
>
>> It's pretty easy. Blue is done with css in the head.
>>
>> http://tomliv.com/svg/
>>
>>
>> --
>>
>>
> Updated to style the circles as well. Have to specify "circle.st0" for
> this to work in chrome. Just the class didn't seem to work.
>
>
>
Updated again. Sorry. My mistake. Just the class is working.
(I had left the style embedded inside the svg, so using "circle.st0" was
just more specific.)

-- 

Tom Livingston | Senior Front End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com


#663399
__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Tom Livingston]

On Wed, Jul 13, 2016 at 4:34 PM, Tom Livingston  wrote:

> It's pretty easy. Blue is done with css in the head.
>
> http://tomliv.com/svg/
>
>
> --
>
>
Updated to style the circles as well. Have to specify "circle.st0" for this
to work in chrome. Just the class didn't seem to work.



-- 

Tom Livingston | Senior Front End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com


#663399
__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Tom Livingston]

It's pretty easy. Blue is done with css in the head.

http://tomliv.com/svg/


-- 

Tom Livingston | Senior Front End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com


#663399
__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Tom Livingston]

On Wed, Jul 13, 2016 at 3:10 PM, Crest Christopher <
crestchristop...@gmail.com> wrote:

> I have a question regarding this
> 
> method; there is no SVG being loaded, is it loading in the background and
> simply being stylizing by a style sheet ?
>
>
> No.

He's loading an svg by putting the svg code in the html and providing a
method of falling back to a png. He is styling the svg with css.



-- 

Tom Livingston | Senior Front End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com


#663399
__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Tom Livingston]

On Wed, Jul 13, 2016 at 4:17 PM, Tom Livingston  wrote:

>
>
> On Wed, Jul 13, 2016 at 3:10 PM, Crest Christopher <
> crestchristop...@gmail.com> wrote:
>
>> I have a question regarding this
>> 
>> method; there is no SVG being loaded, is it loading in the background and
>> simply being stylizing by a style sheet ?
>>
>>
>> No.
>
> He's loading an svg by putting the svg code in the html and providing a
> method of falling back to a png. He is styling the svg with css.
>

As opposed to adding an svg using 



-- 

Tom Livingston | Senior Front End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com


#663399
__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Crest Christopher]

I have a question regarding this 
 
method; there is no SVG being loaded, is it loading in the background 
and simply being stylizing by a style sheet ?



Tom Livingston 
Tuesday, July 12, 2016 11:49 PM
https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_started/SVG_and_CSS



On Tuesday, July 12, 2016, Crest Christopher 


Crest Christopher 
Tuesday, July 12, 2016 10:57 PM
I only said, it was a post to make it easier to find I understand it 
meant; likes.


you can only set the properties for the entire symbol with this
method. So, if you have two paths in your symbol and want them to
have different fill colors, this won't work, but if you want all
your paths to be the same, this should work

That is the problem, I cannot independently stylize different paths in 
the SVG file.

Chris Williams 
Tuesday, July 12, 2016 2:49 PM
1) That's not "post 16" that's a reply with 16 (now 17) likes.
2) Is explicitly says in the example: 



__
css-discuss [css-d@lists.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/
Crest Christopher 
Tuesday, July 12, 2016 10:30 AM
Look at, post 16 on stack overflow ?

The example SVG file doesn't have a class called fill-red or 
fill-blue, how is it being stylized ?



Rick Gordon 
Monday, July 11, 2016 8:32 PM
Is this any help?

http://stackoverflow.com/questions/18434094/how-to-style-svg-with-external-css 



-


___
RICK GORDON
EMERALD VALLEY GRAPHICS AND CONSULTING
___
WWW: http://www.shelterpub.co
__
css-discuss [css-d@lists.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/
Crest Christopher 
Saturday, July 09, 2016 11:24 PM
I've been searching on how I can style SVG files embedded in a 
 tag, including CSS animation.


Can someone point me in the direction, how I can stylize a SVG object 
contained in a  tag though CSS; otherwise it appears jQuery 
is the only direction.


Chris Williams 
Tuesday, July 12, 2016 2:49 PM
1) That's not "post 16" that's a reply with 16 (now 17) likes.
2) Is explicitly says in the example: 



__
css-discuss [css-d@lists.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/
Crest Christopher 
Tuesday, July 12, 2016 10:30 AM
Look at, post 16 on stack overflow ?

The example SVG file doesn't have a class called fill-red or 
fill-blue, how is it being stylized ?



Rick Gordon 
Monday, July 11, 2016 8:32 PM
Is this any help?

http://stackoverflow.com/questions/18434094/how-to-style-svg-with-external-css 



-


___
RICK GORDON
EMERALD VALLEY GRAPHICS AND CONSULTING
___
WWW: http://www.shelterpub.co
__
css-discuss [css-d@lists.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/


__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Chris Williams]

You can stylize different components of the SVG like any other component. If 
they have an ID, use it. Otherwise, you can use their type (e.g. circle, etc.) 
and the cascade to control which of them (e.g. which circle) gets effected. You 
can use the "first-child", "nth-child" and all those other pseudo selectors on 
them. If you need to, give the items in the SVG and ID all their own.

I guess I'm not understanding why this is so hard. I have styled SVG in a 
number of cases. I simply go into the debugger (e.g. Chrome or FF) and explore 
the DOM, look through the SVG, find the items I'm looking for and build CSS to 
handle it.

From: Crest Christopher 
<crestchristop...@gmail.com<mailto:crestchristop...@gmail.com>>
Date: Tuesday, July 12, 2016 at 7:57 PM
To: Chris Williams <ch...@clwill.com<mailto:ch...@clwill.com>>
Cc: CSS-Discuss 
<css-d@lists.css-discuss.org<mailto:css-d@lists.css-discuss.org>>
Subject: Re: [css-d] Style Object tag svg

I only said, it was a post to make it easier to find I understand it meant; 
likes.

you can only set the properties for the entire symbol with this method. So, if 
you have two paths in your symbol and want them to have different fill colors, 
this won't work, but if you want all your paths to be the same, this should work
That is the problem, I cannot independently stylize different paths in the SVG 
file.

__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Tom Livingston]

https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_started/SVG_and_CSS



On Tuesday, July 12, 2016, Crest Christopher 
wrote:

> I only said, it was a post to make it easier to find I understand it
> meant; likes.
>
>you can only set the properties for the entire symbol with this
>method. So, if you have two paths in your symbol and want them to
>have different fill colors, this won't work, but if you want all
>your paths to be the same, this should work
>
> That is the problem, I cannot independently stylize different paths in the
> SVG file.
>
>> Chris Williams 
>> Tuesday, July 12, 2016 2:49 PM
>> 1) That's not "post 16" that's a reply with 16 (now 17) likes.
>> 2) Is explicitly says in the example: 
>>
>>
>>
>> __
>> css-discuss [css-d@lists.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/
>> Crest Christopher 
>> Tuesday, July 12, 2016 10:30 AM
>> Look at, post 16 on stack overflow ?
>>
>> The example SVG file doesn't have a class called fill-red or fill-blue,
>> how is it being stylized ?
>>
>>
>> Rick Gordon 
>> Monday, July 11, 2016 8:32 PM
>> Is this any help?
>>
>>
>> http://stackoverflow.com/questions/18434094/how-to-style-svg-with-external-css
>>
>> -
>>
>>
>> ___
>> RICK GORDON
>> EMERALD VALLEY GRAPHICS AND CONSULTING
>> ___
>> WWW: http://www.shelterpub.co
>> __
>> css-discuss [css-d@lists.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/
>> Crest Christopher 
>> Saturday, July 09, 2016 11:24 PM
>> I've been searching on how I can style SVG files embedded in a 
>> tag, including CSS animation.
>>
>> Can someone point me in the direction, how I can stylize a SVG object
>> contained in a  tag though CSS; otherwise it appears jQuery is the
>> only direction.
>>
>
> __
> css-discuss [css-d@lists.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/
>


-- 

Tom Livingston | Senior Front End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com


#663399
__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Crest Christopher]

I only said, it was a post to make it easier to find I understand it 
meant; likes.


   you can only set the properties for the entire symbol with this
   method. So, if you have two paths in your symbol and want them to
   have different fill colors, this won't work, but if you want all
   your paths to be the same, this should work

That is the problem, I cannot independently stylize different paths in 
the SVG file.

Chris Williams 
Tuesday, July 12, 2016 2:49 PM
1) That's not "post 16" that's a reply with 16 (now 17) likes.
2) Is explicitly says in the example: 



__
css-discuss [css-d@lists.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/
Crest Christopher 
Tuesday, July 12, 2016 10:30 AM
Look at, post 16 on stack overflow ?

The example SVG file doesn't have a class called fill-red or 
fill-blue, how is it being stylized ?



Rick Gordon 
Monday, July 11, 2016 8:32 PM
Is this any help?

http://stackoverflow.com/questions/18434094/how-to-style-svg-with-external-css 



-


___
RICK GORDON
EMERALD VALLEY GRAPHICS AND CONSULTING
___
WWW: http://www.shelterpub.co
__
css-discuss [css-d@lists.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/
Crest Christopher 
Saturday, July 09, 2016 11:24 PM
I've been searching on how I can style SVG files embedded in a 
 tag, including CSS animation.


Can someone point me in the direction, how I can stylize a SVG object 
contained in a  tag though CSS; otherwise it appears jQuery is 
the only direction.


__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Chris Williams]

1) That's not "post 16" that's a reply with 16 (now 17) likes.
2) Is explicitly says in the example: 



On 7/12/16, 7:30 AM, "css-d-boun...@lists.css-discuss.org on behalf of Crest 
Christopher"  wrote:

>Look at, post 16 on stack overflow ?
>
>The example SVG file doesn't have a class called fill-red or fill-blue, 
>how is it being stylized ?
>
>> Rick Gordon 
>> Monday, July 11, 2016 8:32 PM
>> Is this any help?
>>
>> http://stackoverflow.com/questions/18434094/how-to-style-svg-with-external-css
>>  
>>
>>
>> -
>>
>>
>> ___
>> RICK GORDON
>> EMERALD VALLEY GRAPHICS AND CONSULTING
>> ___
>> WWW: http://www.shelterpub.co
>> __
>> css-discuss [css-d@lists.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/
>> Crest Christopher 
>> Saturday, July 09, 2016 11:24 PM
>> I've been searching on how I can style SVG files embedded in a 
>>  tag, including CSS animation.
>>
>> Can someone point me in the direction, how I can stylize a SVG object 
>> contained in a  tag though CSS; otherwise it appears jQuery is 
>> the only direction.
>
>__
>css-discuss [css-d@lists.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/
__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Philip Taylor]

Stu Graham - Linnets wrote:
>  
>
> Hi, 
>
> Please can you remove me from this mailing list now. 
> List-Unsubscribe: ,
>   

__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Stu Graham - Linnets]

 

Hi, 

Please can you remove me from this mailing list now. 

Thanks 

Stu 

STUART GRAHAM | RUNCORN LINNETS JUNIOR FOOTBALL CLUB 

-

E: stuart.gra...@runcornlinnetsjfc.co.uk W: www.RuncornLinnetsJFC.co.uk
[7]
M: +44(0) 7903 950 318 

-

_"HELP CUT CARBONPLEASE DO NOT PRINT THIS EMAIL UNLESS YOU
REALLY NEED TO"_ 

_This email is confidential and intended solely for the use of the
individual to whom it is addressed. Any representations contractual or
otherwise, views or opinions presented are solely those of the author
and do not necessarily represent those of Runcorn Linnets JFC. If you
are not the intended recipient be advised that you have received this
email in error and that any use, dissemination, forwarding, printing or
copying of this email is strictly prohibited. If you have received this
email in error please notify the sender._ 

On 12/07/2016 15:30, Crest Christopher wrote: 

> Look at, post 16 on stack overflow ?
> 
> The example SVG file doesn't have a class called fill-red or fill-blue, how 
> is it being stylized ?
> 
>> Rick Gordon  Monday, July 11, 2016 8:32 PM Is 
>> this any help? 
>> http://stackoverflow.com/questions/18434094/how-to-style-svg-with-external-css
>>  [1] - ___ RICK 
>> GORDON EMERALD VALLEY GRAPHICS AND CONSULTING 
>> ___ WWW: http://www.shelterpub.co 
>> [2] __ 
>> css-discuss [css-d@lists.css-discuss.org] 
>> http://www.css-discuss.org/mailman/listinfo/css-d [3] List wiki/FAQ -- 
>> http://css-discuss.incutio.com/ [4] List policies -- 
>> http://css-discuss.org/policies.html [5] Supported by evolt.org -- 
>> http://www.evolt.org/help_support_evolt/ [6] Crest Christopher 
>>  Saturday, July 09, 2016 11:24 PM I've 
>> been searching on how I can style SVG files embedded in a  tag, 
>> including CSS animation. Can someone point me in the direction, how I can 
>> stylize a SVG object contained i
 n a
 tag though CSS; otherwise it appears jQuery is the only direction.
> 
> __
> css-discuss [css-d@lists.css-discuss.org]
> http://www.css-discuss.org/mailman/listinfo/css-d [3]
> List wiki/FAQ -- http://css-discuss.incutio.com/ [4]
> List policies -- http://css-discuss.org/policies.html [5]
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ [6]
 

Links:
--
[1]
http://stackoverflow.com/questions/18434094/how-to-style-svg-with-external-css
[2] http://www.shelterpub.co
[3] http://www.css-discuss.org/mailman/listinfo/css-d
[4] http://css-discuss.incutio.com/
[5] http://css-discuss.org/policies.html
[6] http://www.evolt.org/help_support_evolt/
[7] http://www.RuncornLinnetsJFC.co.uk
__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Crest Christopher]

Look at, post 16 on stack overflow ?

The example SVG file doesn't have a class called fill-red or fill-blue, 
how is it being stylized ?



Rick Gordon 
Monday, July 11, 2016 8:32 PM
Is this any help?

http://stackoverflow.com/questions/18434094/how-to-style-svg-with-external-css 



-


___
RICK GORDON
EMERALD VALLEY GRAPHICS AND CONSULTING
___
WWW: http://www.shelterpub.co
__
css-discuss [css-d@lists.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/
Crest Christopher 
Saturday, July 09, 2016 11:24 PM
I've been searching on how I can style SVG files embedded in a 
 tag, including CSS animation.


Can someone point me in the direction, how I can stylize a SVG object 
contained in a  tag though CSS; otherwise it appears jQuery is 
the only direction.


__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Crest Christopher]

A condition, what if I don't want to use  strictly just 
style the SVG; it should work ?



Tom Livingston 
Monday, July 11, 2016 9:31 PM
On Mon, Jul 11, 2016 at 9:26 PM, Crest Christopher<
crestchristop...@gmail.com>  wrote:


It looks promising until put into use, without using foreignObject as it's
a condition; rather strictly using  then targeting the SVG by
simply

SVG {
color: red /* or */
border: solid 4px red;
}

Nothing happens ?



Might wanna read that stuff again. "foreignObject" was just a way to add a
fallback.





Tom Livingston
Monday, July 11, 2016 8:57 PM
Can't the svg code be put on the page without the use of?

I came across this:

http://thoughtfulweb.com/thoughts/on/the-best-way-to-add-an-svg-image-to-your-website

and it mentions putting the svg code inline and that this is how you can
target it with css...
"The first important thing to note is the SVG is inline. If the SVG is not
inline then you can not target it with CSS."
that seems more straight forward and logical to me.


On Mon, Jul 11, 2016 at 7:35 PM, Crest Christopher<


Crest Christopher
Monday, July 11, 2016 7:35 PM
.class #svg-object body  ?


Karl DeSaulniers
Sunday, July 10, 2016 10:58 PM
if your talking about styling the contents of the object tag, you would
have include the body tag of the object tag kind of like an iframe.

.styleclass #svgobj body .childelementclass #childelement

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com





__
css-discuss [css-d@lists.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/
Crest Christopher
Sunday, July 10, 2016 10:52 PM
You could stylize the classes within the SVG individually as well ?


Karl DeSaulniers
Sunday, July 10, 2016 10:50 PM
Crest,
I was successful at styling your svg (that isn't loading btw).

Firstly, Your using display inline on everything. When you use
display:inline, width and height do not get computed correctly.
so your object is collapsing to 0px. change to inline-block

Secondly, you have visibility: hidden on the container element. You wont
see any styling if this is set.

I am not going to share my code since you said you wanted to do this
yourself,
but I can tell you for certain your svg object can be styled.

GL!

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com





__
css-discuss [css-d@lists.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/






Tom Livingston 
Monday, July 11, 2016 8:57 PM
Can't the svg code be put on the page without the use of ?

I came across this:
http://thoughtfulweb.com/thoughts/on/the-best-way-to-add-an-svg-image-to-your-website

and it mentions putting the svg code inline and that this is how you can
target it with css...
"The first important thing to note is the SVG is inline. If the SVG is not
inline then you can not target it with CSS."
that seems more straight forward and logical to me.


On Mon, Jul 11, 2016 at 7:35 PM, Crest Christopher <


Crest Christopher 
Monday, July 11, 2016 7:35 PM
.class #svg-object body  ?


Karl DeSaulniers 
Sunday, July 10, 2016 10:58 PM
if your talking about styling the contents of the object tag, you 
would have include the body tag of the object tag kind of like an iframe.


.styleclass #svgobj body .childelementclass #childelement

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com





__
css-discuss [css-d@lists.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/
Crest Christopher 
Sunday, July 10, 2016 10:52 PM
You could stylize the classes within the SVG individually as well ?




__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Tom Livingston]

On Mon, Jul 11, 2016 at 9:26 PM, Crest Christopher <
crestchristop...@gmail.com> wrote:

> It looks promising until put into use, without using foreignObject as it's
> a condition; rather strictly using  then targeting the SVG by
> simply
>
> SVG {
> color: red /* or */
> border: solid 4px red;
> }
>
> Nothing happens ?
>

Might wanna read that stuff again. "foreignObject" was just a way to add a
fallback.



>
>

> Tom Livingston 
> Monday, July 11, 2016 8:57 PM
> Can't the svg code be put on the page without the use of ?
>
> I came across this:
>
> http://thoughtfulweb.com/thoughts/on/the-best-way-to-add-an-svg-image-to-your-website
>
> and it mentions putting the svg code inline and that this is how you can
> target it with css...
> "The first important thing to note is the SVG is inline. If the SVG is not
> inline then you can not target it with CSS."
> that seems more straight forward and logical to me.
>
>
> On Mon, Jul 11, 2016 at 7:35 PM, Crest Christopher <
>
>
> Crest Christopher 
> Monday, July 11, 2016 7:35 PM
> .class #svg-object body  ?
>
>
> Karl DeSaulniers 
> Sunday, July 10, 2016 10:58 PM
> if your talking about styling the contents of the object tag, you would
> have include the body tag of the object tag kind of like an iframe.
>
> .styleclass #svgobj body .childelementclass #childelement
>
> Best,
>
> Karl DeSaulniers
> Design Drumm
> http://designdrumm.com
>
>
>
>
>
> __
> css-discuss [css-d@lists.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/
> Crest Christopher 
> Sunday, July 10, 2016 10:52 PM
> You could stylize the classes within the SVG individually as well ?
>
>
> Karl DeSaulniers 
> Sunday, July 10, 2016 10:50 PM
> Crest,
> I was successful at styling your svg (that isn't loading btw).
>
> Firstly, Your using display inline on everything. When you use
> display:inline, width and height do not get computed correctly.
> so your object is collapsing to 0px. change to inline-block
>
> Secondly, you have visibility: hidden on the container element. You wont
> see any styling if this is set.
>
> I am not going to share my code since you said you wanted to do this
> yourself,
> but I can tell you for certain your svg object can be styled.
>
> GL!
>
> Best,
>
> Karl DeSaulniers
> Design Drumm
> http://designdrumm.com
>
>
>
>
>
> __
> css-discuss [css-d@lists.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/
>
>
>


-- 

Tom Livingston | Senior Front End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com


#663399
__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Crest Christopher]

It looks promising until put into use, without using foreignObject as 
it's a condition; rather strictly using  then targeting the SVG 
by simply


|SVG {
color: red /* or */
border: solid 4px red;
} |

Nothing happens ?


Tom Livingston 
Monday, July 11, 2016 8:57 PM
Can't the svg code be put on the page without the use of ?

I came across this:
http://thoughtfulweb.com/thoughts/on/the-best-way-to-add-an-svg-image-to-your-website

and it mentions putting the svg code inline and that this is how you can
target it with css...
"The first important thing to note is the SVG is inline. If the SVG is not
inline then you can not target it with CSS."
that seems more straight forward and logical to me.


On Mon, Jul 11, 2016 at 7:35 PM, Crest Christopher <


Crest Christopher 
Monday, July 11, 2016 7:35 PM
.class #svg-object body  ?


Karl DeSaulniers 
Sunday, July 10, 2016 10:58 PM
if your talking about styling the contents of the object tag, you 
would have include the body tag of the object tag kind of like an iframe.


.styleclass #svgobj body .childelementclass #childelement

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com





__
css-discuss [css-d@lists.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/
Crest Christopher 
Sunday, July 10, 2016 10:52 PM
You could stylize the classes within the SVG individually as well ?


Karl DeSaulniers 
Sunday, July 10, 2016 10:50 PM
Crest,
I was successful at styling your svg (that isn't loading btw).

Firstly, Your using display inline on everything. When you use 
display:inline, width and height do not get computed correctly.

so your object is collapsing to 0px. change to inline-block

Secondly, you have visibility: hidden on the container element. You 
wont see any styling if this is set.


I am not going to share my code since you said you wanted to do this 
yourself,

but I can tell you for certain your svg object can be styled.

GL!

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com





__
css-discuss [css-d@lists.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/


__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Tom Livingston]

Can't the svg code be put on the page without the use of ?

I came across this:
http://thoughtfulweb.com/thoughts/on/the-best-way-to-add-an-svg-image-to-your-website

and it mentions putting the svg code inline and that this is how you can
target it with css...
"The first important thing to note is the SVG is inline. If the SVG is not
inline then you can not target it with CSS."
that seems more straight forward and logical to me.


On Mon, Jul 11, 2016 at 7:35 PM, Crest Christopher <
crestchristop...@gmail.com> wrote:

> .class #svg-object body  ?
>
> Karl DeSaulniers 
>> Sunday, July 10, 2016 10:58 PM
>> if your talking about styling the contents of the object tag, you would
>> have include the body tag of the object tag kind of like an iframe.
>>
>> .styleclass #svgobj body .childelementclass #childelement
>>
>> Best,
>>
>> Karl DeSaulniers
>> Design Drumm
>> http://designdrumm.com
>>
>>


-- 

Tom Livingston | Senior Front End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com


#663399
__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Rick Gordon]

Is this any help?

http://stackoverflow.com/questions/18434094/how-to-style-svg-with-external-css

-
On 7/9/16, 8:24 PM, Crest Christopher wrote:
I've been searching on how I can style SVG files embedded in a 
 tag, including CSS animation.


Can someone point me in the direction, how I can stylize a SVG object 
contained in a  tag though CSS; otherwise it appears jQuery is 
the only direction.


___
RICK GORDON
EMERALD VALLEY GRAPHICS AND CONSULTING
___
WWW: http://www.shelterpub.co
__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Crest Christopher]

.class #svg-object body  ?


Karl DeSaulniers 
Sunday, July 10, 2016 10:58 PM
if your talking about styling the contents of the object tag, you 
would have include the body tag of the object tag kind of like an iframe.


.styleclass #svgobj body .childelementclass #childelement

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com





__
css-discuss [css-d@lists.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/
Crest Christopher 
Sunday, July 10, 2016 10:52 PM
You could stylize the classes within the SVG individually as well ?


Karl DeSaulniers 
Sunday, July 10, 2016 10:50 PM
Crest,
I was successful at styling your svg (that isn't loading btw).

Firstly, Your using display inline on everything. When you use 
display:inline, width and height do not get computed correctly.

so your object is collapsing to 0px. change to inline-block

Secondly, you have visibility: hidden on the container element. You 
wont see any styling if this is set.


I am not going to share my code since you said you wanted to do this 
yourself,

but I can tell you for certain your svg object can be styled.

GL!

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com





__
css-discuss [css-d@lists.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/
Chris Williams 
Sunday, July 10, 2016 2:35 PM
It's not clear to me exactly what the question is.

Can you style SVG inside divs on a page? Yes, I've done it frequently.

How? Simple, and like every other CSS case: use a debugger (Chrome, 
FF, IE) and look at the object structure, figure out the hierarchy you 
want/need and go for it.


Do I have to use jQuery? No. If you want to get fancy, you might have 
to use JavaScript, but that doesn't mean you have to use jQuery (and 
all it's weight). The JS isn't that complex.





__
css-discuss [css-d@lists.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/
Crest Christopher 
Sunday, July 10, 2016 11:06 AM
Any more suggestions, it's pretty common question but I want to do it, 
hopefully, with strictly CSS; every site I find related to the subject 
either explains a jQuery solution or it's clear, or not clear at all 
on a solution, as I'll be using this, if I can find, solution quite often.





__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Crest Christopher]

What container are you referring too ?


Karl DeSaulniers 
Sunday, July 10, 2016 10:50 PM
Crest,
I was successful at styling your svg (that isn't loading btw).

Firstly, Your using display inline on everything. When you use 
display:inline, width and height do not get computed correctly.

so your object is collapsing to 0px. change to inline-block

Secondly, you have visibility: hidden on the container element. You 
wont see any styling if this is set.


I am not going to share my code since you said you wanted to do this 
yourself,

but I can tell you for certain your svg object can be styled.

GL!

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com





__
css-discuss [css-d@lists.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/
Chris Williams 
Sunday, July 10, 2016 2:35 PM
It's not clear to me exactly what the question is.

Can you style SVG inside divs on a page? Yes, I've done it frequently.

How? Simple, and like every other CSS case: use a debugger (Chrome, 
FF, IE) and look at the object structure, figure out the hierarchy you 
want/need and go for it.


Do I have to use jQuery? No. If you want to get fancy, you might have 
to use JavaScript, but that doesn't mean you have to use jQuery (and 
all it's weight). The JS isn't that complex.





__
css-discuss [css-d@lists.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/
Crest Christopher 
Sunday, July 10, 2016 11:06 AM
Any more suggestions, it's pretty common question but I want to do it, 
hopefully, with strictly CSS; every site I find related to the subject 
either explains a jQuery solution or it's clear, or not clear at all 
on a solution, as I'll be using this, if I can find, solution quite often.



Karl DeSaulniers 
Sunday, July 10, 2016 10:55 AM
I think a link to a live example would be best here.

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com





__
css-discuss [css-d@lists.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/
Crest Christopher 
Sunday, July 10, 2016 10:51 AM
Tom, I read the second page you linked too as well.

I tried, considering the ID is within a class; .className #svg-object: 
12px solid red. There is no red border around my SVG object.  Even if 
it worked, I want to access the path classes or id within the SVG and 
style outside of the SVG file.





__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Karl DeSaulniers]

if your talking about styling the contents of the object tag, you would have 
include the body tag of the object tag kind of like an iframe.

.styleclass #svgobj body .childelementclass #childelement

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com




> On Jul 10, 2016, at 9:52 PM, Crest Christopher  
> wrote:
> 
> You could stylize the classes within the SVG individually as well ?
> 
>> Karl DeSaulniers 
>> Sunday, July 10, 2016 10:50 PM
>> Crest,
>> I was successful at styling your svg (that isn't loading btw).
>> 
>> Firstly, Your using display inline on everything. When you use 
>> display:inline, width and height do not get computed correctly.
>> so your object is collapsing to 0px. change to inline-block
>> 
>> Secondly, you have visibility: hidden on the container element. You wont see 
>> any styling if this is set.
>> 
>> I am not going to share my code since you said you wanted to do this 
>> yourself,
>> but I can tell you for certain your svg object can be styled.
>> 
>> GL!
>> 
>> Best,
>> 
>> Karl DeSaulniers
>> Design Drumm
>> http://designdrumm.com
>> 
>> 
>> 
>> 
>> 
>> __
>> css-discuss [css-d@lists.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/
>> Chris Williams 
>> Sunday, July 10, 2016 2:35 PM
>> It's not clear to me exactly what the question is.
>> 
>> Can you style SVG inside divs on a page? Yes, I've done it frequently.
>> 
>> How? Simple, and like every other CSS case: use a debugger (Chrome, FF, IE) 
>> and look at the object structure, figure out the hierarchy you want/need and 
>> go for it.
>> 
>> Do I have to use jQuery? No. If you want to get fancy, you might have to use 
>> JavaScript, but that doesn't mean you have to use jQuery (and all it's 
>> weight). The JS isn't that complex.
>> 
>> 
>> 
>> 
>> __
>> css-discuss [css-d@lists.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/
>> Crest Christopher 
>> Sunday, July 10, 2016 11:06 AM
>> Any more suggestions, it's pretty common question but I want to do it, 
>> hopefully, with strictly CSS; every site I find related to the subject 
>> either explains a jQuery solution or it's clear, or not clear at all on a 
>> solution, as I'll be using this, if I can find, solution quite often.
>> 
>> 
>> Karl DeSaulniers 
>> Sunday, July 10, 2016 10:55 AM
>> I think a link to a live example would be best here.
>> 
>> Best,
>> 
>> Karl DeSaulniers
>> Design Drumm
>> http://designdrumm.com
>> 
>> 
>> 
>> 
>> 
>> __
>> css-discuss [css-d@lists.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/
>> Crest Christopher 
>> Sunday, July 10, 2016 10:51 AM
>> Tom, I read the second page you linked too as well.
>> 
>> I tried, considering the ID is within a class; .className #svg-object: 12px 
>> solid red. There is no red border around my SVG object.  Even if it worked, 
>> I want to access the path classes or id within the SVG and style outside of 
>> the SVG file.
>> 
>> 
> 
> __
> css-discuss [css-d@lists.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/

__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Crest Christopher]

I'm going to test, now I can.


Karl DeSaulniers 
Sunday, July 10, 2016 10:50 PM
Crest,
I was successful at styling your svg (that isn't loading btw).

Firstly, Your using display inline on everything. When you use 
display:inline, width and height do not get computed correctly.

so your object is collapsing to 0px. change to inline-block

Secondly, you have visibility: hidden on the container element. You 
wont see any styling if this is set.


I am not going to share my code since you said you wanted to do this 
yourself,

but I can tell you for certain your svg object can be styled.

GL!

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com





__
css-discuss [css-d@lists.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/
Chris Williams 
Sunday, July 10, 2016 2:35 PM
It's not clear to me exactly what the question is.

Can you style SVG inside divs on a page? Yes, I've done it frequently.

How? Simple, and like every other CSS case: use a debugger (Chrome, 
FF, IE) and look at the object structure, figure out the hierarchy you 
want/need and go for it.


Do I have to use jQuery? No. If you want to get fancy, you might have 
to use JavaScript, but that doesn't mean you have to use jQuery (and 
all it's weight). The JS isn't that complex.





__
css-discuss [css-d@lists.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/
Crest Christopher 
Sunday, July 10, 2016 11:06 AM
Any more suggestions, it's pretty common question but I want to do it, 
hopefully, with strictly CSS; every site I find related to the subject 
either explains a jQuery solution or it's clear, or not clear at all 
on a solution, as I'll be using this, if I can find, solution quite often.



Karl DeSaulniers 
Sunday, July 10, 2016 10:55 AM
I think a link to a live example would be best here.

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com





__
css-discuss [css-d@lists.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/
Crest Christopher 
Sunday, July 10, 2016 10:51 AM
Tom, I read the second page you linked too as well.

I tried, considering the ID is within a class; .className #svg-object: 
12px solid red. There is no red border around my SVG object.  Even if 
it worked, I want to access the path classes or id within the SVG and 
style outside of the SVG file.





__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Crest Christopher]

You could stylize the classes within the SVG individually as well ?


Karl DeSaulniers 
Sunday, July 10, 2016 10:50 PM
Crest,
I was successful at styling your svg (that isn't loading btw).

Firstly, Your using display inline on everything. When you use 
display:inline, width and height do not get computed correctly.

so your object is collapsing to 0px. change to inline-block

Secondly, you have visibility: hidden on the container element. You 
wont see any styling if this is set.


I am not going to share my code since you said you wanted to do this 
yourself,

but I can tell you for certain your svg object can be styled.

GL!

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com





__
css-discuss [css-d@lists.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/
Chris Williams 
Sunday, July 10, 2016 2:35 PM
It's not clear to me exactly what the question is.

Can you style SVG inside divs on a page? Yes, I've done it frequently.

How? Simple, and like every other CSS case: use a debugger (Chrome, 
FF, IE) and look at the object structure, figure out the hierarchy you 
want/need and go for it.


Do I have to use jQuery? No. If you want to get fancy, you might have 
to use JavaScript, but that doesn't mean you have to use jQuery (and 
all it's weight). The JS isn't that complex.





__
css-discuss [css-d@lists.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/
Crest Christopher 
Sunday, July 10, 2016 11:06 AM
Any more suggestions, it's pretty common question but I want to do it, 
hopefully, with strictly CSS; every site I find related to the subject 
either explains a jQuery solution or it's clear, or not clear at all 
on a solution, as I'll be using this, if I can find, solution quite often.



Karl DeSaulniers 
Sunday, July 10, 2016 10:55 AM
I think a link to a live example would be best here.

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com





__
css-discuss [css-d@lists.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/
Crest Christopher 
Sunday, July 10, 2016 10:51 AM
Tom, I read the second page you linked too as well.

I tried, considering the ID is within a class; .className #svg-object: 
12px solid red. There is no red border around my SVG object.  Even if 
it worked, I want to access the path classes or id within the SVG and 
style outside of the SVG file.





__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Karl DeSaulniers]

Crest,
I was successful at styling your svg (that isn't loading btw).

Firstly, Your using display inline on everything. When you use display:inline, 
width and height do not get computed correctly.
so your object is collapsing to 0px. change to inline-block

Secondly, you have visibility: hidden on the container element. You wont see 
any styling if this is set.

I am not going to share my code since you said you wanted to do this yourself, 
but I can tell you for certain your svg object can be styled.

GL!

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com




> On Jul 10, 2016, at 1:35 PM, Chris Williams  wrote:
> 
> It's not clear to me exactly what the question is.
> 
> Can you style SVG inside divs on a page? Yes, I've done it frequently.
> 
> How? Simple, and like every other CSS case: use a debugger (Chrome, FF, IE) 
> and look at the object structure, figure out the hierarchy you want/need and 
> go for it.
> 
> Do I have to use jQuery? No. If you want to get fancy, you might have to use 
> JavaScript, but that doesn't mean you have to use jQuery (and all it's 
> weight). The JS isn't that complex.
> 
> 
> 
> 
> On 7/10/16, 8:06 AM, "css-d-boun...@lists.css-discuss.org on behalf of Crest 
> Christopher"  crestchristop...@gmail.com> wrote:
> 
>> Any more suggestions, it's pretty common question but I want to do it, 
>> hopefully, with strictly CSS; every site I find related to the subject 
>> either explains a jQuery solution or it's clear, or not clear at all on 
>> a solution, as I'll be using this, if I can find, solution quite often.
>> 
>>> Karl DeSaulniers 
>>> Sunday, July 10, 2016 10:55 AM
>>> I think a link to a live example would be best here.
>>> 
>>> Best,
>>> 
>>> Karl DeSaulniers
>>> Design Drumm
>>> http://designdrumm.com
>>> 
>>> 
>>> 
>>> 
>>> 
>>> __
>>> css-discuss [css-d@lists.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/
>>> Karl DeSaulniers 
>>> Sunday, July 10, 2016 12:26 AM
>>> Hi Crest,
>>> Will this work?
>>> 
>>> div#svgid object {
>>> border: 1px solid #cfcfcf;
>>> }
>>> 
>>> Best,
>>> 
>>> Karl DeSaulniers
>>> Design Drumm
>>> http://designdrumm.com
>>> 
>>> 
>>> 
>>> 
>>> 
>>> __
>>> css-discuss [css-d@lists.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/
>>> Crest Christopher 
>>> Saturday, July 09, 2016 11:24 PM
>>> I've been searching on how I can style SVG files embedded in a 
>>>  tag, including CSS animation.
>>> 
>>> Can someone point me in the direction, how I can stylize a SVG object 
>>> contained in a  tag though CSS; otherwise it appears jQuery is 
>>> the only direction.
>> 
>> __
>> css-discuss [css-d@lists.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/
> __
> css-discuss [css-d@lists.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/

__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Chris Williams]

It's not clear to me exactly what the question is.

Can you style SVG inside divs on a page? Yes, I've done it frequently.

How? Simple, and like every other CSS case: use a debugger (Chrome, FF, IE) and 
look at the object structure, figure out the hierarchy you want/need and go for 
it.

Do I have to use jQuery? No. If you want to get fancy, you might have to use 
JavaScript, but that doesn't mean you have to use jQuery (and all it's weight). 
The JS isn't that complex.




On 7/10/16, 8:06 AM, "css-d-boun...@lists.css-discuss.org on behalf of Crest 
Christopher"  wrote:

>Any more suggestions, it's pretty common question but I want to do it, 
>hopefully, with strictly CSS; every site I find related to the subject 
>either explains a jQuery solution or it's clear, or not clear at all on 
>a solution, as I'll be using this, if I can find, solution quite often.
>
>> Karl DeSaulniers 
>> Sunday, July 10, 2016 10:55 AM
>> I think a link to a live example would be best here.
>>
>> Best,
>>
>> Karl DeSaulniers
>> Design Drumm
>> http://designdrumm.com
>>
>>
>>
>>
>>
>> __
>> css-discuss [css-d@lists.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/
>> Karl DeSaulniers 
>> Sunday, July 10, 2016 12:26 AM
>> Hi Crest,
>> Will this work?
>>
>> div#svgid object {
>> border: 1px solid #cfcfcf;
>> }
>>
>> Best,
>>
>> Karl DeSaulniers
>> Design Drumm
>> http://designdrumm.com
>>
>>
>>
>>
>>
>> __
>> css-discuss [css-d@lists.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/
>> Crest Christopher 
>> Saturday, July 09, 2016 11:24 PM
>> I've been searching on how I can style SVG files embedded in a 
>>  tag, including CSS animation.
>>
>> Can someone point me in the direction, how I can stylize a SVG object 
>> contained in a  tag though CSS; otherwise it appears jQuery is 
>> the only direction.
>
>__
>css-discuss [css-d@lists.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/
__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Tom Livingston]

And I still don't see a link. Just references to line numbers and code.

On Sunday, July 10, 2016, Karl DeSaulniers  wrote:

> I'm getting 4 emails every time you post Crest. Please prune your send to
> addresses. Or at very least delete my email.
>
> Thanks,
> Karl
>
> Sent from losPhone
>
> > On Jul 10, 2016, at 10:06 AM, Crest Christopher <
> crestchristop...@gmail.com > wrote:
> >
> > Any more suggestions, it's pretty common question but I want to do it,
> hopefully, with strictly CSS; every site I find related to the subject
> either explains a jQuery solution or it's clear, or not clear at all on a
> solution, as I'll be using this, if I can find, solution quite often.
> >
> >> Karl DeSaulniers >
> >> Sunday, July 10, 2016 10:55 AM
> >> I think a link to a live example would be best here.
> >>
> >> Best,
> >>
> >> Karl DeSaulniers
> >> Design Drumm
> >> http://designdrumm.com
> >>
> >>
> >>
> >>
> >>
> >> __
> >> css-discuss [css-d@lists.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/
> >> Karl DeSaulniers >
> >> Sunday, July 10, 2016 12:26 AM
> >> Hi Crest,
> >> Will this work?
> >>
> >> div#svgid object {
> >> border: 1px solid #cfcfcf;
> >> }
> >>
> >> Best,
> >>
> >> Karl DeSaulniers
> >> Design Drumm
> >> http://designdrumm.com
> >>
> >>
> >>
> >>
> >>
> >> __
> >> css-discuss [css-d@lists.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/
> >> Crest Christopher >
> >> Saturday, July 09, 2016 11:24 PM
> >> I've been searching on how I can style SVG files embedded in a 
> tag, including CSS animation.
> >>
> >> Can someone point me in the direction, how I can stylize a SVG object
> contained in a  tag though CSS; otherwise it appears jQuery is the
> only direction.
> >
> > __
> > css-discuss [css-d@lists.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/
> __
> css-discuss [css-d@lists.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/
>


-- 

Tom Livingston | Senior Front End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com


#663399
__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Karl DeSaulniers]

I'm getting 4 emails every time you post Crest. Please prune your send to 
addresses. Or at very least delete my email. 

Thanks,
Karl

Sent from losPhone

> On Jul 10, 2016, at 10:06 AM, Crest Christopher  
> wrote:
> 
> Any more suggestions, it's pretty common question but I want to do it, 
> hopefully, with strictly CSS; every site I find related to the subject either 
> explains a jQuery solution or it's clear, or not clear at all on a solution, 
> as I'll be using this, if I can find, solution quite often.
> 
>> Karl DeSaulniers 
>> Sunday, July 10, 2016 10:55 AM
>> I think a link to a live example would be best here.
>> 
>> Best,
>> 
>> Karl DeSaulniers
>> Design Drumm
>> http://designdrumm.com
>> 
>> 
>> 
>> 
>> 
>> __
>> css-discuss [css-d@lists.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/
>> Karl DeSaulniers 
>> Sunday, July 10, 2016 12:26 AM
>> Hi Crest,
>> Will this work?
>> 
>> div#svgid object {
>> border: 1px solid #cfcfcf;
>> }
>> 
>> Best,
>> 
>> Karl DeSaulniers
>> Design Drumm
>> http://designdrumm.com
>> 
>> 
>> 
>> 
>> 
>> __
>> css-discuss [css-d@lists.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/
>> Crest Christopher 
>> Saturday, July 09, 2016 11:24 PM
>> I've been searching on how I can style SVG files embedded in a  tag, 
>> including CSS animation.
>> 
>> Can someone point me in the direction, how I can stylize a SVG object 
>> contained in a  tag though CSS; otherwise it appears jQuery is the 
>> only direction.
> 
> __
> css-discuss [css-d@lists.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/
__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Tom Livingston]

I'm with Karl. Need a link.

On Sunday, July 10, 2016, Crest Christopher 
wrote:

> Any more suggestions, it's pretty common question but I want to do it,
> hopefully, with strictly CSS; every site I find related to the subject
> either explains a jQuery solution or it's clear, or not clear at all on a
> solution, as I'll be using this, if I can find, solution quite often.
>
> Karl DeSaulniers 
>> Sunday, July 10, 2016 10:55 AM
>> I think a link to a live example would be best here.
>>
>> Best,
>>
>> Karl DeSaulniers
>> Design Drumm
>> http://designdrumm.com
>>
>>
>>
>>
>>
>> __
>> css-discuss [css-d@lists.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/
>> Karl DeSaulniers 
>> Sunday, July 10, 2016 12:26 AM
>> Hi Crest,
>> Will this work?
>>
>> div#svgid object {
>> border: 1px solid #cfcfcf;
>> }
>>
>> Best,
>>
>> Karl DeSaulniers
>> Design Drumm
>> http://designdrumm.com
>>
>>
>>
>>
>>
>> __
>> css-discuss [css-d@lists.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/
>> Crest Christopher 
>> Saturday, July 09, 2016 11:24 PM
>> I've been searching on how I can style SVG files embedded in a 
>> tag, including CSS animation.
>>
>> Can someone point me in the direction, how I can stylize a SVG object
>> contained in a  tag though CSS; otherwise it appears jQuery is the
>> only direction.
>>
>
> __
> css-discuss [css-d@lists.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/
>


-- 

Tom Livingston | Senior Front End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com


#663399
__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Crest Christopher]

Any more suggestions, it's pretty common question but I want to do it, 
hopefully, with strictly CSS; every site I find related to the subject 
either explains a jQuery solution or it's clear, or not clear at all on 
a solution, as I'll be using this, if I can find, solution quite often.



Karl DeSaulniers 
Sunday, July 10, 2016 10:55 AM
I think a link to a live example would be best here.

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com





__
css-discuss [css-d@lists.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/
Karl DeSaulniers 
Sunday, July 10, 2016 12:26 AM
Hi Crest,
Will this work?

div#svgid object {
border: 1px solid #cfcfcf;
}

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com





__
css-discuss [css-d@lists.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/
Crest Christopher 
Saturday, July 09, 2016 11:24 PM
I've been searching on how I can style SVG files embedded in a 
 tag, including CSS animation.


Can someone point me in the direction, how I can stylize a SVG object 
contained in a  tag though CSS; otherwise it appears jQuery is 
the only direction.


__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Karl DeSaulniers]

I think a link to a live example would be best here.

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com




> On Jul 10, 2016, at 9:51 AM, Crest Christopher  
> wrote:
> 
> Tom, I read the second page you linked too as well.
> 
> I tried, considering the ID is within a class; .className #svg-object: 12px 
> solid red. There is no red border around my SVG object.  Even if it worked, I 
> want to access the path classes or id within the SVG and style outside of the 
> SVG file.
> 
>> Karl DeSaulniers 
>> Sunday, July 10, 2016 12:26 AM
>> Hi Crest,
>> Will this work?
>> 
>> div#svgid object {
>> border: 1px solid #cfcfcf;
>> }
>> 
>> Best,
>> 
>> Karl DeSaulniers
>> Design Drumm
>> http://designdrumm.com
>> 
>> 
>> 
>> 
>> 
>> __
>> css-discuss [css-d@lists.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/
>> Crest Christopher 
>> Saturday, July 09, 2016 11:24 PM
>> I've been searching on how I can style SVG files embedded in a  tag, 
>> including CSS animation.
>> 
>> Can someone point me in the direction, how I can stylize a SVG object 
>> contained in a  tag though CSS; otherwise it appears jQuery is the 
>> only direction.
> 
> __
> css-discuss [css-d@lists.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/

__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Crest Christopher]

Tom, I read the second page you linked too as well.

I tried, considering the ID is within a class; .className #svg-object: 
12px solid red. There is no red border around my SVG object.  Even if it 
worked, I want to access the path classes or id within the SVG and style 
outside of the SVG file.



Karl DeSaulniers 
Sunday, July 10, 2016 12:26 AM
Hi Crest,
Will this work?

div#svgid object {
border: 1px solid #cfcfcf;
}

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com





__
css-discuss [css-d@lists.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/
Crest Christopher 
Saturday, July 09, 2016 11:24 PM
I've been searching on how I can style SVG files embedded in a 
 tag, including CSS animation.


Can someone point me in the direction, how I can stylize a SVG object 
contained in a  tag though CSS; otherwise it appears jQuery is 
the only direction.


__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Karl DeSaulniers]

Might need to be this to cover all systems or the embed may be a Flash thing 
only, not sure.
No time to look into it.

div#svgid object, div#svgid embed {
border: 1px solid #cfcfcf;
}

HTH,

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com




> On Jul 9, 2016, at 11:26 PM, Karl DeSaulniers  wrote:
> 
> Hi Crest,
> Will this work?
> 
> div#svgid  object {
>   border: 1px solid #cfcfcf;
> }
> 
> Best,
> 
> Karl DeSaulniers
> Design Drumm
> http://designdrumm.com
> 
> 
> 
> 
>> On Jul 9, 2016, at 10:24 PM, Crest Christopher  
>> wrote:
>> 
>> I've been searching on how I can style SVG files embedded in a  tag, 
>> including CSS animation.
>> 
>> Can someone point me in the direction, how I can stylize a SVG object 
>> contained in a  tag though CSS; otherwise it appears jQuery is the 
>> only direction.
>> __
>> css-discuss [css-d@lists.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/
> 
> __
> css-discuss [css-d@lists.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/

__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Karl DeSaulniers]

Hi Crest,
Will this work?

div#svgid  object {
border: 1px solid #cfcfcf;
}

Best,

Karl DeSaulniers
Design Drumm
http://designdrumm.com




> On Jul 9, 2016, at 10:24 PM, Crest Christopher  
> wrote:
> 
> I've been searching on how I can style SVG files embedded in a  tag, 
> including CSS animation.
> 
> Can someone point me in the direction, how I can stylize a SVG object 
> contained in a  tag though CSS; otherwise it appears jQuery is the 
> only direction.
> __
> css-discuss [css-d@lists.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/

__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Crest Christopher]

I read the entire one article on SVG and the  tag from Saras 
page; but it doesn't tell me how I can style id or classes by a embedded 
style sheet or external; she goes into viewbox and javascript and data 
tag etc.



Tom Livingston 
Saturday, July 09, 2016 11:42 PM
Google Sara Soueidan. She's very knowledgeable on SVG.




On Saturday, July 9, 2016, Crest Christopher 


Crest Christopher 
Saturday, July 09, 2016 11:24 PM
I've been searching on how I can style SVG files embedded in a 
 tag, including CSS animation.


Can someone point me in the direction, how I can stylize a SVG object 
contained in a  tag though CSS; otherwise it appears jQuery is 
the only direction.


__
css-discuss [css-d@lists.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/

Re: [css-d] Style Object tag svg

[Tom Livingston]

Google Sara Soueidan. She's very knowledgeable on SVG.




On Saturday, July 9, 2016, Crest Christopher 
wrote:

> I've been searching on how I can style SVG files embedded in a 
> tag, including CSS animation.
>
> Can someone point me in the direction, how I can stylize a SVG object
> contained in a  tag though CSS; otherwise it appears jQuery is the
> only direction.
> __
> css-discuss [css-d@lists.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/
>


-- 

Tom Livingston | Senior Front End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com


#663399
__
css-discuss [css-d@lists.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/