Content bigger than its container but entirely within non-excluded area clears a far-left floater for no reason -- Large Gap Above Content on NerdStore.com.br

Confirmed Issue #8832174 • Assigned to Peter S.

Details

Author
Jonathan S.
Created
Sep 10, 2016
Privacy
This issue is public.
Found in
  • Microsoft Edge
  • Internet Explorer
Found in build #
14.14915
Reports
Reported by 10 people

Sign in to watch or report this issue.

Steps to reproduce

https://jsfiddle.net/t3wvm9n7/1/](https://jsfiddle.net/t3wvm9n7/1/)[https://jsfiddle.net/t3wvm9n7/1/](https://jsfiddle.net/t3wvm9n7/1/)

 

  1. Navigate to http://www.nerdstore.com.br/busca/?fq=H:362
  2. Note the gap above the content

Reduction:
http://jsbin.com/kawunigapu/edit?html,output

Description of the problem:
Right column contains a fieldset element with negative margins, that causes it to extend beyond the floated left navigation boundary. This causes a wrapping to take place, pushing the content down unnecessarily.

Workaround:
Use overflow:hidden on the right content element.

Original Report:
https://twitter.com/jeisondiasf/status/774699729754157056

Attachments

0 attachments

    Comments and activity

    • Microsoft Edge Team

      Changed Assigned To to “Ibrahim O.”

      Changed Assigned To to “Bogdan B.”

      Changed Title from “Large Gap Above Content on NerdStore.com.br” to “Content bigger than container but within acceptable area just clear left content for no reason -- Large Gap Above Content on NerdStore.com.br”

      Changed Assigned To from “Bogdan B.” to “Francois R.”

      Changed Status to “Confirmed”

      Changed Steps to Reproduce

      Changed Title from “Content bigger than container but within acceptable area just clear left content for no reason -- Large Gap Above Content on NerdStore.com.br” to “Content bigger than its container but entirely within non-excluded area clears a far-left floater for no reason -- Large Gap Above Content on NerdStore.com.br”

    • Hi Jonathan :-)

       

      I think your reduction of this case is not accurate. The behavior we have in that particular case is by-design, you don’t want to have the div be under and excluded area if you can avoid that by pushing it down. I can see other browsers don’t do that very well, but that is a bug on their end, not ours.

       

      That particular case you send us is a case where the div, despite its negative margin, does not intersect with the excluded area, so it should not be cleared further down. The source of the bug seems to be a negative-top-margin right-float box at the top of the left div, as can be seen in the new repro. If the top-right-floated box intersects even a little with the right box, our behavior is ok. What happens when that box does not intersect at all is definitely a bug.

       

      Best regards,

      Francois

    • Microsoft Edge Team

      Changed Assigned To to “Bogdan B.”

      Changed Assigned To from “Bogdan B.” to “Peter S.”

    You need to sign in to your Microsoft account to add a comment.

    Sign in