New issue
Advanced search Search tips

Issue 904833 link

Starred by 1 user
Status: Duplicate
Merged: issue 599828
Owner: ----
Closed: Nov 14
Cc:
viswa.karala@chromium.org
cbiesin...@chromium.org
Components:
EstimatedDays: ----
NextAction: ----
OS: Linux , Windows , Mac
Pri: 2
Type: Bug


Participants' hotlists:
izlemedeyim


Sign in to add a comment

Flex items/lines incorrectly stretch their cross-size even though align-content != stretch

Reported by datade...@gmail.com, Nov 13 
UserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:63.0) Gecko/20100101 Firefox/63.0

Steps to reproduce the problem:
1. 
2. 
3. 

What is the expected behavior?
If one tag has height and using align-content: flex-start.
All rows rebuild flex-start position.  

What went wrong?
If has items on one line. Line height same of parent tag height. This is wrong. If you use stretch, you can see wrongs.

Did this work before? N/A 

Chrome version: <Copy from: 'about:version'>  Channel: stable
OS Version: 10.0
Flash Version: Shockwave Flash 31.0 r0

You can try it here. Url live time unknown.
https://jsfiddle.net/deveb/wk4cq1dn/

<div style="min-height:300px; display:flex; flex-wrap:wrap; align-content: flex-start; align-items: flex-start;">
<div style="display:flex; width:50%; align-self: stretch; background: red;">
stretch
</div>
<div style="display:flex; width:50%;background:blue;">
normal
</div>
</div>

Comment 1 by woxxom@gmail.com, Nov 13 

Bisected to r276717 "Blink roll 175978:176011"
https://chromium.googlesource.com/chromium/blink/+log/2336dd31..fbc0350b
Suspecting 5e11ff5456153f78ed9b45b53684575eba0a5173
"Flex box word-wrap is not adhering to spec"
Landed in 37.0.2047.0

Comment 2 by woxxom@gmail.com, Nov 13 

This is how it looks in FF.

Comment 3 by datade...@gmail.com, Nov 13 

And you can try this
https://jsfiddle.net/deveb/wk4cq1dn/9/

<div style="min-height:300px; display:flex; flex-wrap:wrap; align-content: flex-start; align-items: flex-start;">
  <div style="display:flex; width:25%; align-self: stretch; background: red;">
    uzatılmış
  </div>
  <div style="display:flex; width:25%; background: red;">
    uzatılmış değil
  </div>
  <div style="display:flex; flex-wrap:wrap; width:50%;background:blue;">
    <div style="width:100%; background:yellow;">
      satır 1
    </div>
    <div style="width:100%; background:pink;">
      satır 2
    </div>
  </div>
</div>

Comment 4 by phanindra.mandapaka@chromium.org, Nov 13

Labels: Needs-Milestone

Comment 5 by viswa.karala@chromium.org, Nov 14

Cc: viswa.karala@chromium.org
Components: -UI Blink>Layout>Flexbox Blink>Layout
Labels: Target-72 FoundIn-72 M-72 FoundIn-71 FoundIn-70 OS-Linux OS-Mac
Status: Untriaged (was: Unconfirmed)
Able to reproduce the issue on chrome version# 70.0.3538.102 and on latest chrome# 72.0.3608.0 with URL's provided in comment# 0 & 3 using Windows-10, Ubuntu 14.04 and Mac 10.12.6. As this issue is seen from M-60(60.0.3112.0), hence considering this issue as Non-Regression and marking it as Untriaged.

Thanks!

Comment 6 by mstensho@chromium.org, Nov 14

Cc: cbiesin...@chromium.org
Status: Available (was: Untriaged)
Summary: Flex items/lines incorrectly stretch their cross-size even though align-content != stretch (was: Flex align-content: flex-start not working)
If align-content isn't stretch, and it's a line-wrapping flexbox, the flex line shouldn't stretch.
tc.html
313 bytes View Download

Comment 7 Deleted

Comment 8 by datade...@gmail.com, Nov 14 

This is not stretch problem. This is align-content problem when has single line.  Because align-content touching lines. Example for multiline. Try this. You will see correctly work. Delete second line items... That is wrong... Not working align-content. 

<div style="display:flex; width:100px; height:210px; flex-wrap:wrap; align-content:flex-start; align-items:stretch; background:yellow;">
  <div style="background:blue;">
    <div style="width:100px; height:100px;"></div>
  </div>
    <div style="background:pink;">
    <div style="width:100px; height:100px;"></div>
  </div>
</div>

Comment 9 by cbiesinger@google.com, Nov 14 

I haven't looked through this in detail but it could be a duplicate of bug 599828

Comment 10 by cbiesin...@chromium.org, Nov 14

Mergedinto: 599828
Status: Duplicate (was: Available)
Yeah, dup of that bug.
►

Sign in to add a comment