Foundation image stack float right


(Rico IJntema) #1

I’m building a website with a lot of articles with Foundation from Joe Workman. The articles have images that need to have text wrapping. I know I can do that in a paragraph stack and drop in an image and set the alignment. I also know that paragraph Pro does well with images and text wrapping.

For quick load-times on all platforms I want to use the foundation image stack, so the website has optimized images for mobile, tablet and desktop.

When I drop a Foundation image stack and a Foundation paragraph stack in a Foundation 1 column stack and in the image settings select in Layout -> Fill mode -> Float. The image aligns to the left and the text wraps around the image. But how can I get the image to align to the right?

It doesn’t matter if I set the Image to align to the center or the right, it stays on the left (settings in Image stack: Sizing & Alignment -> Align.)

Can anybody help?


(Robert Ziebol 🖖🏼) #2

Why not use the Float stacks that come with the Stacks Plugin?? The first one called Float allows you to drop in any stack.

08%20AM

Here it is with the Foundation Image stack in it:


(Rico IJntema) #3

Thanks, that works! Didn’t know that I could use that together with the image stack.


(Rico IJntema) #4

Hi Robert,

Almost perfect the floating stack… On a mobile screen the image doesn’t get full screen, so you end up with a tiny image on mobile. In a 2 column stack with an image in one column and text in the other on smaller screens the column collapses to a 1 column with a fullscreen image and fullscreen text.
Do you or anybody else know a way around this with the floating stack or with the foundation stacks?


(Rob Beattie) #5

You could try downloading this. Might help you out.


(system) #6

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.