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

Table width issue when width in float value #2174

Closed
dipakupmetrics opened this issue Jun 4, 2024 · 3 comments
Closed

Table width issue when width in float value #2174

dipakupmetrics opened this issue Jun 4, 2024 · 3 comments
Labels
bug Existing features not working as expected
Milestone

Comments

@dipakupmetrics
Copy link

image

image

I have encountered an issue with WeasyPrint when using floating-point percentages for widths. Specifically, setting a width like width: 10.255% (resulting in CSS issues as shown in the provided image) causes WeasyPrint to CSS issue, whereas a width of width: 10% works correctly.

In our case, these widths are set by the Froala editor, and we do not manually adjust them. How can we ensure that WeasyPrint handles floating-point percentages correctly when these values are generated by Froala?

@liZe
Copy link
Member

liZe commented Jun 4, 2024

Hi!

Could you please share a HTML/CSS sample that could help us to reproduce your problem?

@dipakupmetrics
Copy link
Author

dipakupmetrics commented Jun 4, 2024

Here is my sample HTML with float width

<!DOCTYPE html>
<html>
<head>
    <title>Plan</title>
    <style>
        table, th, td {
            border: 1px solid black;
        }
    </style>
</head>
<body>
<div class="container">
    <table id="budgetTable" class="froalaAlternateRows" style="margin-right: calc(0%); width: 100%;">
        <tbody>
        <tr>
            <td style="width: 70.9463%; background-color: rgb(209, 213, 216);"><strong>Description</strong><br></td>
            <td style="width: 28.7597%; background-color: rgb(209, 213, 216);"><strong>Annual Budget</strong><br></td>
        </tr>
        <tr>
            <td class="fr-thick" colspan="2" style="width: 96.7639%;">
                <div style="text-align: left;"><strong>Programming &amp; Events</strong></div>
            </td>
        </tr>
        <tr>
            <td style="width: 70.9463%;">
                <div><strong>Entrepreneurial / Commercialization Support Programs</strong></div>
                Necessary funds to establish and maintain incubators, accelerators, and entrepreneurship centers in the
                District, providing support services, mentorship, networking, and resources for startups and
                entrepreneurs, including budget for contracting a program manager like Gust for Innovation
                Ecosystems.<br></td>
            <td style="width: 28.7597%;">$300,000<br></td>
        </tr>
        <tr>
            <td style="width: 70.9463%;"><strong>Partnership and Collaboration Initiatives</strong><br>Investment in
                initiatives to foster collaboration between academic researchers, industry partners, government
                agencies, and other stakeholders.<br></td>
            <td style="width: 28.7597%;">$100,000<br></td>
        </tr>
        <tr>
            <td style="width: 70.9463%;"><strong>Continuing Education and Workforce Development</strong><br>Investment
                in educational and training programs, including partnerships with corporations or education partners, to
                support workshops, conferences, and seminars in the District. Essential for training innovators,
                researchers, clinicians, and healthcare professionals, aligned with the District's focus areas.<br></td>
            <td style="width: 28.7597%;">$100,000<br></td>
        </tr>
        <tr>
            <td style="width: 70.9463%;"><strong>Community Outreach &amp; Engagement</strong><br>Funding to support
                engagement between local entities and residents, including organizing community events, educational
                outreach initiatives, and volunteer activities. Additionally, these funds support communication
                platforms for feedback and updates on local initiatives, ensuring that outreach efforts are inclusive
                and effectively address community needs.<br></td>
            <td style="width: 28.7597%;">$75,000<br></td>
        </tr>
        <tr>
            <td style="width: 70.9463%; text-align: right;"><strong>&nbsp;</strong><strong>Total Programming &amp; Event
                Expenses</strong><br></td>
            <td style="width: 28.7597%;"><strong>$575,000</strong><br></td>
        </tr>
        <tr>
            <td colspan="2" style="width: 96.7639%;">
                <div><strong>BD, Marketing and Public Relations</strong></div>
            </td>
        </tr>
        <tr>
            <td style="width: 70.9463%;">
                <div><strong>Attraction Activities (Business Development)</strong></div>
                This funding boosts efforts to market the district and attract startups, corporate partners, investors,
                and top talent. It encompasses expenses for networking—including meetings, meals, and
                entertainment—along with costs for attending conferences, trade shows, and golf tournaments.
                Additionally, it supports participation in industry events and outreach activities, showcasing the
                district’s capabilities and achievements to engage potential tenants, partners, and collaborators.<br>
            </td>
            <td style="width: 28.7597%;">$200,000<br></td>
        </tr>
        <tr>
            <td style="width: 70.9463%;"><strong>Sales Tools &amp; Software</strong><br>Includes investments in CRM
                (Customer Relationship Management) systems, sales automation software, data analytics tools, and other
                digital platforms that streamline sales processes, enhance customer interactions, and boost revenue
                growth. Additionally, funding supports market research tools essential for conducting surveys and
                analysis to better understand market dynamics and customer needs.<br></td>
            <td style="width: 28.7597%;">$30,000<br></td>
        </tr>
        <tr>
            <td style="width: 70.9463%;"><strong>Sales Collateral &amp; Signage</strong><br>The design, photography, and
                printing or production of brochures, sales kits, and event signage, ensuring high-quality materials that
                effectively support marketing and sales efforts.<br></td>
            <td style="width: 28.7597%;">$20,000<br></td>
        </tr>
        <tr>
            <td style="width: 70.9463%;"><strong>Advertising &amp; PR</strong><br>Includes digital advertising, social
                media campaigns, press releases, and media outreach to boost visibility and engagement. It also
                incorporates lead generation and nurturing activities such as email marketing and the use of lead
                magnets to attract and retain potential clients.<br></td>
            <td style="width: 28.7597%;">$65,000<br></td>
        </tr>
        <tr>
            <td style="width: 70.9463%;"><strong>Events &amp; Sponsorships</strong><br>Supports both hosting District
                events and sponsorships of outside industry events, fostering networking and showcasing the district's
                contributions and capabilities.<br></td>
            <td style="width: 28.7597%;">$50,000<br></td>
        </tr>
        <tr>
            <td style="width: 70.9463%; text-align: right;"><strong>&nbsp;</strong><strong>Total BD, Marketing &amp; PR
                Expenses</strong><br></td>
            <td style="width: 28.7597%;"><strong>$365,000</strong><br></td>
        </tr>
        <tr>
            <td style="width: 70.9463%; text-align: right;"><strong>&nbsp;</strong><strong>TOTAL ANNUAL OUTREACH
                EXPENSES</strong><br></td>
            <td style="width: 28.7597%;"><strong>$940,000</strong><br></td>
        </tr>
        </tbody>
    </table>
</div>
</body>
</html>

@liZe liZe added the bug Existing features not working as expected label Jun 4, 2024
@liZe liZe closed this as completed in f275321 Jun 4, 2024
@liZe
Copy link
Member

liZe commented Jun 4, 2024

The old width distribution algorithm was really complex, really strange, and… really broken. The new code is much closer to the specification’s algorithm and gives the same result as browsers, with ~50 lines of code removed. 😄

@liZe liZe added this to the 63.0 milestone Jun 4, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Existing features not working as expected
Projects
None yet
Development

No branches or pull requests

2 participants