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

Fix overflow for tables with collapsing borders and ignore "overflow-wrap: break-word" when calculating min-content intrinsic sizes #582

Closed
ivoronin opened this issue Mar 4, 2018 · 3 comments
Closed

Fix overflow for tables with collapsing borders and ignore "overflow-wrap: break-word" when calculating min-content intrinsic sizes #582

ivoronin opened this issue Mar 4, 2018 · 3 comments
Labels
bug Existing features not working as expected
Milestone
43

Comments

@ivoronin
Copy link

ivoronin commented Mar 4, 2018

Source file

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title></title>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.0/normalize.css" integrity="sha256-7GAtDQ79wTEOjhBKf70uBQG7A5yyb+8rigu07atXWDY=" crossorigin="anonymous">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/github-markdown-css/2.10.0/github-markdown.css" integrity="sha256-qTBXiGmok0OwSTNA1uvNgoO6GSylS8Ty3TBjogwOxVo=" crossorigin="anonymous">
</head>
<body>
  <article class="markdown-body">
    <table>
      <thead>
        <tr>
          <th>Non numquam</th>
          <th>Lorem markdownum</th>
          <th>Duis aute</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td>Google Chrome</td>
          <td>Eaque ipsa quae ab illo inventore veritatis et
          quasi</td>
          <td>Cupiditate non provident, similique sunt in culpa qui
          officia deserunt mollitia.</td>
        </tr>
        <tr>
          <td>Mozilla Firefox</td>
          <td>Eaque ipsa quae ab illo inventore veritatis et
          quasi</td>
          <td>Cupiditate non provident, similique sunt in culpa qui
          officia deserunt mollitia.</td>
        </tr>
      </tbody>
    </table>
  </article>
</body>
</html>

Expected result (rendered with Prince 11.3)

default

Actual result (rendered with weasyprint 0.42.2)

default

Discrepancies

  • Wrong word wrapping
  • Right table border is missing
@liZe liZe added the bug Existing features not working as expected label Mar 4, 2018
@liZe
Copy link
Member

liZe commented Mar 4, 2018 •
edited
Loading

Minimal use case:

<style>
  body {
    word-wrap: break-word;
  }

  table {
    border-collapse: collapse;
    display: block;
    overflow: auto;
  }

  th, td {
    border: 1px solid;
  }
</style>
<table>
  <tbody>
    <tr>
      <td>Non numquam</td>
      <td>Eaque ipsa quae ab illo inventore veritatis et quasi</td>
      <td>Cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia.</td>
    </tr>
  </tbody>
</table>
  • The word is broken because of word-wrap: break-word, but in table layout this seems to be ignored for some reason. It's more an implementation detail than a real bug in WeasyPrint IMHO, but I'll try to fix this if it's easy.
  • The right border is missing because of table { display: block; overflow: auto }. That's a bug I have to fix. (table { display: block }, really?!)

@liZe
Copy link
Member

liZe commented Mar 5, 2018

For the record, the spec says:

Soft wrap opportunities introduced by overflow-wrap: break-word are not considered when calculating min-content intrinsic sizes.

liZe added a commit that referenced this issue Mar 5, 2018
@liZe
Propagate overflow to the table wrapper
05b2a59 
Without that, tables with "overflow: auto" don't draw their borders.

Related to #582.
liZe added a commit that referenced this issue Mar 5, 2018
@liZe
Remove table border from available width when borders collapse
957ffe7 
Related to #582.
@liZe liZe closed this as completed in 63db508 Mar 5, 2018
@liZe liZe added this to the 43 milestone Mar 5, 2018
@liZe
Copy link
Member

liZe commented Mar 5, 2018

capture d ecran de 2018-03-05 01-27-19

(Don't expect future bugs to be fixed that fast 😉)

@liZe liZe changed the title Table rendering flaws Fix overflow for tables with collapsing borders and ignore "overflow-wrap: break-word" when calculating min-content intrinsic sizes Mar 5, 2018
liZe added a commit that referenced this issue Mar 27, 2018
@liZe
Propagate overflow to the table wrapper
16ef163 
Without that, tables with "overflow: auto" don't draw their borders.

Related to #582.
liZe added a commit that referenced this issue Mar 27, 2018
@liZe
Remove table border from available width when borders collapse
f631cec 
Related to #582.
liZe added a commit that referenced this issue Mar 27, 2018
@liZe
Ignore overflow_wrap: break-word when calculating min-content width
f8993ca 
See https://drafts.csswg.org/css-text-3/#overflow-wrap-property

Fix #582.
@liZe liZe mentioned this issue Aug 8, 2018
Closed
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
43
Development

No branches or pull requests
2 participants
@liZe @ivoronin