How can an svg use the border property as an attribute?

HTML & CSS
1

How is this allowed?

I thought an svg can only use certain properties, and border certainly wasn’t one of them.

How is this even able to do what it is doing?

I never knew of a border to be part of an svg’s repertoire.

svg {
  border-bottom: 3px solid red;
  border-right: 3px solid red;
}

Border is not listed as an svg attribute here:

2

As far as I can see, border is not being used as an SVG attribute in your JSFiddle code. It is a CSS property being applied to the SVG element.

2 Likes
3

I guess you can do that then.

4

Terminology is important:). An attribute is html and html elements are allowed certain attributes as required by their specs. This has nothing to do with css properties;)

3 Likes
5

I find outline to work much better here than border.

Because then the lines aren’t clickable.

Unless something else would be better to use.

svg {
  outline: 3px solid red;
}
7

You seem to have moved away from the subject of this thread, as that code has nothing to do with either SVG or border.

If you have a different issue you need to discuss, I suggest you start a new thread.

1 Like
8

ok, I’ll do that. Thank you.

1 Like
9

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.