99problems icon indicating copy to clipboard operation
99problems copied to clipboard

ADE 2.0+ has some odd stacking behavior when multiple floats are used

Open makeBetterEBooks opened this issue 10 years ago • 3 comments

When multiple images floated to the same side are placed in close proximity to each other, the "text wrap" goes wonky (got all technical there) and starts overlapping the images.

Can be fixed by placing another (non-floated) object between the offending images and using clear: both; on that. I usually wrap things in superfluous divs to achieve this.

float_bug

makeBetterEBooks avatar Jul 10 '14 03:07 makeBetterEBooks

Hi, My solutions is below: screen shot 2014-07-10 at 2 23 38 pm screen shot 2014-07-10 at 2 23 46 pm screen shot 2014-07-10 at 2 18 19 pm screen shot 2014-07-10 at 2 15 44 pm

teytag avatar Jul 10 '14 11:07 teytag

@teytag I'm not saying that solution wouldn't work, but the example you provide doesn't demonstrate the issue. The problem occurs when the images collide. What happens if the amount of text between the first and second image isn't enough to fill the vertical height of the first image?

makeBetterEBooks avatar Jul 10 '14 14:07 makeBetterEBooks

Hi, My second solution is below:

screen shot 2014-07-10 at 5 32 20 pm screen shot 2014-07-10 at 5 32 44 pm screen shot 2014-07-10 at 5 36 18 pm screen shot 2014-07-10 at 5 36 23 pm screen shot 2014-07-10 at 5 34 57 pm

teytag avatar Jul 10 '14 14:07 teytag