Flex items didn't get adjusted by inner contents's size. #560

andycall · 2024-02-27T07:31:24Z

Affected version

main

Flutter versions

3.16.3

No same issues found.

Yes, I search all issues but not found.

Steps to Reproduce

Code example

<!DOCTYPE html>
<html>
<head>
  <style>
  .flex-wrap{
    width: 400px;
    background: pink;
    display: flex;
    padding: 10px;
  }
  .flex1 {
    width: 40px;
    height: 40px;
    background: yellow
  }
  .flex2 {
    flex: 1;
    background: forestgreen;
  }
  .flex3 {
    max-width: 80px;
  }
    </style>
</head>
<body>
<div class="container">
  <div class="flex-wrap">
    <div class="flex2">
      <!-- lass="checkbox" type="checkbox" disabled name="" lass="checkbox" type="checkbox" disabled name="" -->
      <p class="p1">class="checkbox" type="checkbox" disabled name="" type="checkbox" disabled name=""</p>
      <p class="p1">class="checkbox" type="checkbox" d isabled name="" type="checkbox" disabled name=""</p>
    </div>
    <div class="flex3">43242423</div>
    <p class="flex1" >aaa</p>
  </div>
</div>

</body>
</html>

Expected results

Actual results

drugsloveyou · 2024-04-02T02:59:53Z

Maybe temporary solution that I found, in _recordRunsMainSize (or directly in webf/lib/src/rendering/flow.dart: 886)

if (runChild is RenderBoxModel) {
- runChildMainSize = runChild.boxSize?.width ?? 0.0;
+ runChildMainSize = runChild.minContentWidth;
  double childMarginLeft = runChild.renderStyle.marginLeft.computedValue;
  double childMarginRight = runChild.renderStyle.marginRight.computedValue;
  runChildMainSize += childMarginLeft + childMarginRight;
}

after fix：

andycall added the bug Something isn't working label Feb 27, 2024

andycall assigned temper357 Feb 27, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Flex items didn't get adjusted by inner contents's size. #560

Flex items didn't get adjusted by inner contents's size. #560

andycall commented Feb 27, 2024

drugsloveyou commented Apr 2, 2024 •

edited

Flex items didn't get adjusted by inner contents's size. #560

Flex items didn't get adjusted by inner contents's size. #560

Comments

andycall commented Feb 27, 2024

Affected version

Flutter versions

No same issues found.

Steps to Reproduce

Code example

Expected results

Actual results

drugsloveyou commented Apr 2, 2024 • edited

drugsloveyou commented Apr 2, 2024 •

edited