Closed Bug 1405406 Opened 7 years ago Closed 2 years ago

Checkbox input types disappears when floated left inside a <div> with `columns` CSS attribute

Categories

(Core :: Layout: Floats, defect)

56 Branch
defect

Tracking

()

RESOLVED DUPLICATE of bug 1441048
Tracking Status
firefox57 --- wontfix
firefox58 --- affected

People

(Reporter: peter.ostrander, Unassigned)

References

Details

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.13; rv:57.0) Gecko/20100101 Firefox/57.0 Build ID: 20171002181526 Steps to reproduce: I created a <div> with the following CSS: `columns: 3;`. Inside that <div> I placed multiple child <div>s. Inside those child <div>s are a checkbox input and a label element. The checkbox has a CSS for `float: left;` applied. Here's a jsfiddle as an example: https://jsfiddle.net/t4rn4u81/ Actual results: The checkbox in the first div that breaks into a new column disappears. Expected results: The checkbox should not disappear.
Component: Untriaged → Layout: Form Controls
Flags: needinfo?(npancholi)
Priority: -- → P3
Assignee: nobody → npancholi
Flags: needinfo?(npancholi)
I was previously not able to reproduce this and I rechecked this on Nightly 60 (with MacOS 10.13 - High Sierra) and I still can't reproduce it.
Assignee: npancholi → nobody

Thank you, Neerja! ✌️

Peter, does this bug still reproduce on your end? The test in comment 0 looks good to me on the lastest Firefox 72.

As of Firefox 70+, I've not been able to reproduce the issue. I think this one can be considered fixed. Thank you!

Nice!

Status: UNCONFIRMED → RESOLVED
Closed: 5 years ago
Resolution: --- → WORKSFORME

I'm sorry to report that I'm having this same issue on Firefox 95 on Ubuntu 20.04. I have a page which uses Bootstrap 5 and shows a series of checkboxes with labels. If I put these inside a div with "columns: 2", often the first checkbox on the second column does not render on Firefox. Even worse, sometimes zooming in slightly on the page will make it render, but zooming in even further will make it disappear again. I'm not having the same rendering issue in any other browser, so it appears that this bug may have re-emerged.

I can reproduce this again using the jsfiddle in comment 0 on Firefox Nightly 2022-01-03 on macOS, but not on Linux.

Severity: normal → S3
Status: RESOLVED → REOPENED
Component: Layout: Form Controls → Layout: Floats
Ever confirmed: true
Priority: P3 → --
Resolution: WORKSFORME → ---
See Also: → 1441048

I have patches in bug 1441048, and it should fix this bug as well.

Status: REOPENED → RESOLVED
Closed: 5 years ago2 years ago
Resolution: --- → DUPLICATE
You need to log in before you can comment on or make changes to this bug.