Float within flex not being displayed correctly

[jjnilton]

Hi, thanks for sharing this great project!

I noticed that floats seem to be misaligned when within a flexbox container. It also seems that justify-content: space-between is not being applied correctly on WeasyPrint's output.

WeasyPrint version 52.5.

Here's an example (on jsbin):

<style>
div {
  
}

.container {
  display: flex;
  justify-content: space-between;
}

.item {
  width: 300px;
  height: 300px;
  border: 1px solid black;
  margin: 5px;
}

.float {
  float: right;
}
</style>
<div class="container">
  <div class="item">
    <span class="float">
      Hello
    </span>
  </div>
  <div class="item">
    <span class="float">
      World
    </span>
  </div>
</div>

Comparing outputs (WeasyPrint on the left):

This is the WeasyPrint output:

weasyprint-issue-weasyprint.pdf

This is Google's Chrome print to PDF output:

weasyprint-issue-chrome.pdf

Let me know if I can provide more info or help with something else.

[liZe]

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