Closed
Bug 1224421
Opened 9 years ago
Closed 9 years ago
On mathleap.org, justify-content: space-between does not flush last flex item to edge, because there's another invisible flex item for abspos placeholder
Categories
(Core :: Layout, defect)
Core
Layout
Tracking
()
VERIFIED
DUPLICATE
of bug 874718
People
(Reporter: gaye, Unassigned)
Details
Attachments
(2 files)
It's supposed to according to the documentation here https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content and chrome does this correctly.
Reporter | ||
Comment 1•9 years ago
|
||
Needinfo since I'm not sure I've put this in the right comp to get it in front of graphics people
Flags: needinfo?(dholbert)
Flags: needinfo?(bugs)
Comment 2•9 years ago
|
||
Gareth, do you have a testcase that demonstrates the problem? This simple test seems to work fine for me: data:text/html,<body style="display:flex; justify-content:space-between"><a>x</a><a>y</a>
Component: DOM: Core & HTML → Layout
Flags: needinfo?(dholbert)
Flags: needinfo?(bugs)
Updated•9 years ago
|
Flags: needinfo?(gaye)
Comment 3•9 years ago
|
||
Please reopen when you have a testcase. Thanks.
Status: NEW → RESOLVED
Closed: 9 years ago
Resolution: --- → INCOMPLETE
Reporter | ||
Updated•9 years ago
|
Status: RESOLVED → REOPENED
Flags: needinfo?(gaye)
Resolution: INCOMPLETE → ---
Reporter | ||
Comment 4•9 years ago
|
||
Screenshot in FF -- note that the right column isn't flushed all the way to the right
Reporter | ||
Updated•9 years ago
|
Attachment #8690884 -
Attachment description: Screenshot from 2015-11-23 11-53-42.png → Gecko screenshot
Reporter | ||
Comment 5•9 years ago
|
||
Note that in chromium the right column is properly right aligned
Reporter | ||
Comment 6•9 years ago
|
||
Does that give you all enough to go off of?
Flags: needinfo?(mats)
Flags: needinfo?(dholbert)
Comment 7•9 years ago
|
||
(In reply to Gareth Aye [:gaye] (back from PTO) from comment #4) > Screenshot in FF -- note that the right column isn't flushed all the way to > the right The backgrounded areas aren't, but the heading "+" is. (In reply to Gareth Aye [:gaye] (back from PTO) from comment #6) > Does that give you all enough to go off of? Nope; there are too many layers of nesting & different things that could be the explanation. (I think it's unlikely this is a "justify-content" bug, really, and it's more likely this is a sizing or clipping bug.) I really would need to see a live testcase. Can you stand a version of this up publicly somewhere? Or, maybe I can take a look at this on your machine in Mozlando, if you'll be there?
Flags: needinfo?(mats)
Flags: needinfo?(gaye)
Flags: needinfo?(dholbert)
Comment 8•9 years ago
|
||
Or, better (and possibly easier for you) -- if you do File | Save Page As and make sure "Web Page, Complete" is selected in the save dialog), do you end up with a local file that reproduces the bug? If so, feel free to post or email a zipped version of that file & its resources folder.
Reporter | ||
Comment 9•9 years ago
|
||
Sure! 1. Go to https://mathleap.org and log in with username dholbert@mozilla.com and password dholbert. 2. Click on "Test Class".
Flags: needinfo?(gaye) → needinfo?(dholbert)
Comment 10•9 years ago
|
||
Thanks! You can delete the account now. What's happening is: the "+" image is absolutely positioned, and per old spec text, we're letting its invisible placeholder create a (otherwise-empty) flex item. *That* flex item (wrapping the invisible placeholder for the "+" image) is getting aligned at the far right, according to "space-between". (And the extra space you're seeing is the space between the final "real" flex item & the flex item for the invisible placeholder.) Bug 874718 will fix this. In the meantime, if you want to work around this, you'll want to make sure the "+" isn't an abspos child of a flex container. (You could make it a sibling, or a child of a flex item.)
Depends on: 874718
Flags: needinfo?(dholbert)
Summary: [flex] justify-content: space-between does not flush last item to edge → On mathleap.org, justify-content: space-between does not flush last flex item to edge, because there's another invisible flex item for abspos placeholder
Comment 11•9 years ago
|
||
(I'm going to dupe this to bug 874718, actually, since I'm confident that bug is what's broken here & what will fix this.)
No longer depends on: 874718
Updated•9 years ago
|
Status: REOPENED → RESOLVED
Closed: 9 years ago → 9 years ago
Resolution: --- → DUPLICATE
Reporter | ||
Comment 13•9 years ago
|
||
Thank you for all of the info :dholbert! I'll cc myself on bug 874718.
Status: RESOLVED → REOPENED
Resolution: DUPLICATE → ---
Updated•9 years ago
|
Status: REOPENED → RESOLVED
Closed: 9 years ago → 9 years ago
Resolution: --- → DUPLICATE
Comment 15•8 years ago
|
||
I'm going to mark this as "VERIFIED" duplicate, because based on all the information available, the duping was correct. (I'm unable to actually test the URL here, since (a) it was behind a login wall, and (b) the site in question seems to have shut down -- "We're shutting down our service to turn 100% of our focus toward new products for education." Hence, just VERIFYING based on the information we have on this bug.)
Status: RESOLVED → VERIFIED
You need to log in
before you can comment on or make changes to this bug.
Description
•