User Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:31.0) Gecko/20100101 Firefox/31.0 (Beta/Release) Build ID: 20140716183446 Steps to reproduce: This example does work on all browsers but Firefox. http://css-tricks.com/minimum-paragraph-widths/ Actual results: The :before pseudo-element does not break, but the floating element overlaps with the :before element. Expected results: The :before pseudo-element should break if a floating element starts overlapping. A real element with the same CSS-rules does that.
Work as expected in current Nightly, compared with Safari and Chrome. Are you able to reproduce with a new profile? You may add a screenshot what it looks like on your system.
Here is a better example, that does not work as expected for me: http://jsfiddle.net/vUB24/1/ It works in Chrome, though.
https://css-tricks.com/examples/MinParagraphWidth/ Does the third example work for you?
Yes, the third example does work for me, but I can't really see the difference to my fiddle-example. That's what confused me. I tried this "trick" on my homepage and it didn't work and since it worked in Chrome I thought it had to be a Firefox/Gecko bug.
It's the "overflow: hidden" that causes the problem, not :before. Also, adding a border-top so that the "overflow: hidden" block isn't at the very top of the container seems to fix it.
Bug 290146 comment 5 makes me think this is the same underlying problem.
Status: UNCONFIRMED → RESOLVED
Last Resolved: 5 years ago
OS: Windows 7 → All
Hardware: x86_64 → All
Resolution: --- → DUPLICATE
Summary: :before pseudo-element won't break on floating elements → overflow:hidden element overlaps floating element when placed at the top of the container
Duplicate of bug: 290146
You need to log in before you can comment on or make changes to this bug.