Previous Message
Next Message

Style Object tag svg

Sent by Crest Christopher on 11 July 2016 03:03


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

> Karl DeSaulniers [EMAIL-REMOVED]>
> 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 [EMAIL-REMOVED]]
> 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 [EMAIL-REMOVED]>
> 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 [EMAIL-REMOVED]]
> 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 [EMAIL-REMOVED]>
> 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 [EMAIL-REMOVED]>
> 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 [EMAIL-REMOVED]]
> 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 [EMAIL-REMOVED]>
> 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 [EMAIL-REMOVED]]
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/
Previous Message
Next Message

Message thread:

Possibly related: