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

Created on 4 Mar 2018  路  3Comments  路  Source: Kozea/WeasyPrint

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
bug

Most helpful comment

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

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

All 3 comments

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?!)

For the record, the spec says:

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

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

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

Was this page helpful?
0 / 5 - 0 ratings

Related issues

antuaneacion picture antuaneacion  路  3Comments

ivanprice picture ivanprice  路  3Comments

SimonSapin picture SimonSapin  路  4Comments

bjornasm picture bjornasm  路  3Comments

muzzamilkhan picture muzzamilkhan  路  3Comments