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.

Sign up for GitHub

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

Jump to bottom

SVG inside flexbox has incorrect size #1109

Closed
napalm00 opened this issue May 7, 2020 · 2 comments
Closed

SVG inside flexbox has incorrect size #1109

napalm00 opened this issue May 7, 2020 · 2 comments
Labels
bug Existing features not working as expected
Milestone
65.0

Comments

@napalm00
Copy link

napalm00 commented May 7, 2020 •
edited
Loading

WeasyPrint 51 / Python 3.8.2 / Ubuntu 18.04

SVG elements without explicit width/height attributes (embedded with <img>, <object> or otherwise) do not scale to the parent's size if the parent is using flexbox. They instead seem to become very small in the rendered PDF.

Test code:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <style>
            html, body {
                margin: 0;
                padding: 0;
                height: 100%;
            }  
            
            body {
                width: 594mm;
            }

            .row {
                flex: 1 1 auto;
                display: flex;
                flex-direction: row;
                height: 100%;
                width: 100%;
            }

            .column {
                flex: 1 1 auto;
                display: flex;
                flex-direction: column;
                height: 100%;
                width: 100%;
            }

            @page {
                size: 594mm 420mm; /* A2 */
                margin: 0mm;
            }   
        </style>
    </head>
    <body>
        <div class="row">
            <div class="column">
                <img style="height: 100%; width: 100%;" src="https://upload.wikimedia.org/wikipedia/commons/5/59/Logo_test.svg">
            </div>
        </div>
    </body>
</html>

WeasyPrint output:
image

As you can see, on a browser the SVG renders with the right dimensions, whereas in WeasyPrint it does not respect the parent element's dimensions.
@liZe
Copy link
Member

liZe commented May 12, 2020

It could be related to #656.

@liZe liZe added the bug Existing features not working as expected label May 12, 2020
@liZe
Copy link
Member

liZe commented Feb 8, 2025

Bug is closed in the flex branch, see #2362.

@liZe liZe closed this as completed Feb 8, 2025
@liZe liZe added this to the 65.0 milestone Mar 13, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug Existing features not working as expected
Projects
None yet
Milestone
65.0
Development

No branches or pull requests
2 participants
@liZe @napalm00