Reverse Quote in Float stack

Foundry Thunder Pack
1

This is another one of these issues where I’m not sure if I’m misunderstanding the way it works, or if there’s something I can do to fix it. This is also such an edge case that I’m not sure if I should just work around it or not, but…

If you have .a Float stack with a right-aligned floating image and a bordered reverse quote, the border of the quote turns up on the right side of the image, as in this screenshot:

54%20AM
54%20AM1150×519 167 KB

I’ve made the quotes black so that the effect is more obvious.

I’ve also tried wrapping the quotes in a container, but then the reverse quote border disappears; I think it’s under the image. The container also wraps oddly, which I’d sort of expect. Bonus screenshot:

33%20AM
33%20AM1109×663 215 KB

I’d be happy to send the project file in if that would help.

2

I’d have to look at it closer when I’m in the office next but it appears to be working the way I’d expect the code to work, it just isn’t an outcome we’d want from it.

The border is not a part of the content but an actual border outside of the content. The float should be taking place inside the content. Hence the outcome. Not what is wanted but what would be expected of the code. Send me a project file and when I’m in the office next I can take a look. Might be Monday though with the holiday weekend here.

3

Thanks, I’ve sent you a project file that illustrates what I’m talking about. In the meantime, have a good weekend!

4

Sat down at the laptop and loaded up your project. Everything is working the way it should as far as the content goes. As I described in my previous post, the “normal” content is wrapping around the “floated” content as it should. The border though is applied to the outside of the content for the quote, and the floated element is inside of the content area, which means the border will be outside of it. It is just the way it works in this case with the CSS float. It is just a case of the two elements not working together in the way that you’d expect visually, but the code is doing what it should.

1 Like
5

Thanks for getting to that so quickly. Guess I’ll go back to the non-reverse quotes.