Closed
Bug 947407
Opened 11 years ago
Closed 4 years ago
3-column list renders all text in 2 columns with empty third column
Categories
(Core :: Layout, defect, P4)
Tracking
()
RESOLVED
INVALID
People
(Reporter: nathan, Unassigned)
References
()
Details
(Keywords: testcase)
Attachments
(3 files)
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.9; rv:25.0) Gecko/20100101 Firefox/25.0 (Beta/Release) Build ID: 20131112160018 Steps to reproduce: I put a lot of effort into narrowing down the issue, you can see my work so far at http://jsbin.com/azOyIHEG/20/edit Basically there is a 2-column section on the page and then a 3-column section after that. The 3-column section has a media query that changes it to two columns on smaller screens. Both contain lists and the 3-column section has it's list-style-type set to none and a column gap measured in a different unit then the two-column section. It also seems to be at least somewhat dependent on the exact size of the content. I currently have bootstrap 3 on my test page - I'm trying to reproduce the bug without it. Demo at http://jsbin.com/azOyIHEG/20/edit (Note: your screen must be at least 1200px wide. I think that requirement will go away if I can reproduce the issue without Bootstrap.) Actual results: The content from the first and second columns both appear in the first column. The content from the third column appears where the second column should be. The third column is empty. Expected results: Three columns with roughly equal amounts of text.
Reporter | ||
Comment 1•11 years ago
|
||
Reporter | ||
Updated•11 years ago
|
Summary: 3-column layout can renders all text in 2 columns with empty third column → 3-column list renders all text in 2 columns with empty third column
Reporter | ||
Comment 2•11 years ago
|
||
Here's an example that reproduces the bug without Bootstrap: http://jsbin.com/azOyIHEG/29/edit
Comment 3•11 years ago
|
||
I think the bug is in the following css. (I do not understand the reason why you need this) <link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.no-icons.min.css" rel="stylesheet">
Reporter | ||
Comment 4•11 years ago
|
||
I actually just managed to reproduce the issue without the 2-column list, so apparently it's not related, or at least not required to produce the bug: http://jsbin.com/azOyIHEG/33/edit
Reporter | ||
Comment 5•11 years ago
|
||
(In reply to Alice0775 White from comment #3) > I think the bug is in the following css. (I do not understand the reason why > you need this) > > <link > href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.no-icons.min. > css" rel="stylesheet"> You probably hadn't seen my update yet, I now have a test case that reproduces the bug without that CSS: http://jsbin.com/azOyIHEG/33/edit
Reporter | ||
Comment 6•11 years ago
|
||
Sorry to keep blasting this, but here is an even further simplified test case: http://jsbin.com/azOyIHEG/42/edit
Reporter | ||
Updated•11 years ago
|
Reporter | ||
Updated•11 years ago
|
Comment 7•11 years ago
|
||
I think jsbin.com is buggy.
Comment 8•11 years ago
|
||
STR
0. Make browser width > 1200px
1. Clear cache if necessary
2. Open attachment 8343993 [details]
--- observe number of columns
2. Reload
--- observe number of columns
Actual Results
After reload, 3 colmuns
Expected Results:
Number of columns should be same as before
Status: UNCONFIRMED → NEW
Component: Untriaged → Layout
Ever confirmed: true
OS: Mac OS X → All
Product: Firefox → Core
Comment 9•11 years ago
|
||
I played around with the CSS and Firefox shows the correct result if I remove… p { margin: 0 0 10px; } …or if I remove… a { padding:3px 1px 0 1px; } …or set the 3px to 0. It seems that the problem has to do with margin or padding – top and bottom.
Comment 10•4 years ago
|
||
After 6 years, the -moz-
prefixed column properties are gone. If I change everything to the unprefixed properties, I cannot reproduce this issue anymore in Nightly 75. Should this be closed?
Reporter | ||
Comment 11•4 years ago
|
||
Yes, I think this should be closed.
Status: NEW → RESOLVED
Closed: 4 years ago
Resolution: --- → INVALID
You need to log in
before you can comment on or make changes to this bug.
Description
•