Previous Message
Next Message

Style Object tag svg

Sent by Tom Livingston on 12 July 2016 02:02


On Mon, Jul 11, 2016 at 9:26 PM, Crest Christopher <
[EMAIL-REMOVED]> wrote:

> It looks promising until put into use, without using foreignObject as it's
> a condition; rather strictly using <switch> 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 [EMAIL-REMOVED]>
> Monday, July 11, 2016 8:57 PM
> Can't the svg code be put on the page without the use of <object>?
>
> 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 [EMAIL-REMOVED]>
> Monday, July 11, 2016 7:35 PM
> .class #svg-object body <class of path in svg> ?
>
>
> Karl DeSaulniers [EMAIL-REMOVED]>
> 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 [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:52 PM
> 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/
>
>
>


-- 

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


#663399
______________________________________________________________________
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: