Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Default rendering of <svg> depending on viewBox attribute presence #4509

Closed
SelenIT opened this issue Apr 7, 2019 · 4 comments

Comments

4 participants
@SelenIT
Copy link
Contributor

commented Apr 7, 2019

All modern browsers display the <svg> elements without specified dimensions and viewBox attribute as default 300x150 (like other embedded content), but if this attribute is present...

...browsers will apply { width: 100%; height: auto; } by default if the image has a viewBox; this behaviour is not defined in any specification.

(quotation from the @AmeliaBR's article)

Shouldn't this peculiarity of <svg> be reflected in the "Rendering" section of the HTML spec?

@annevk

This comment has been minimized.

Copy link
Member

commented Apr 8, 2019

Doesn't this follow from how sizing works in CSS when there is an intrinsic aspect ratio but no intrinsic width or height?

@AmeliaBR

This comment has been minimized.

Copy link

commented Apr 8, 2019

It wasn't defined at the time that article was written, but CSS has since expanded the rules for intrinsic sizing considerably. And SVG 2 now references those rules.

I haven't gone through the final spec text carefully with this inconsistency in mind to see if it's clearly defined now, but if a clarification or extra rule is still needed, it probably belongs in CSS Sizing, not HTML.

@rniwa

This comment has been minimized.

Copy link
Collaborator

commented Apr 13, 2019

Sounds like this issue can be closed then?? Maybe we can add an example of how this works for a SVG. Regardless, it seems like this should really be tracked in the CSS WG's issue tracker.

@SelenIT

This comment has been minimized.

Copy link
Contributor Author

commented Apr 18, 2019

Thank you for the clarification! Since it's defined in CSS, I close this.

@SelenIT SelenIT closed this Apr 18, 2019

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.