Picture left or right side of the grid

For my photo site I should like to be able to put a whole photo right or left from the standard grid.
A wide box filled with a photo you can only stretch up and down. Of course I can cover part of the image with a box (set with 999 px to left or right), but that’s not what I want.

A normal box, filled with an image (set one border to 999 px) gives a color block outside, no photo. The same with an image box.

Does anybody know if it is possible what I try to achieve?

Yep @BLB there is a way to do it…

You can achieve it with using a Popup Fixed In Window.

  • Drop in your Image element and fill with your image
  • Use the Horizontal dropdown and Align Left / Right
  • Adjust the Margin Left / Right
  • Open Automatically set to 0 seconds

Remember your image is fixed to the edge of the browser window and therefor the image will always be moving dependent on the browser width.

Play around with it to get a good feel for what it does and see if that is a solution for you…

Thank you very much, Hendrik! It’s a kind of a detour, but it works and opens new possibilities in Sparkle.
Now I have to try it out more to use it in the proper places.
Very much appreciated!

1 Like


I was just wondering how this looks on a portrait smartphone?
Or do you want to do without this layout?
Unfortunately, popups cannot be defined per device.

Mr. F.

Mr_Fozzie, you are right! I can only use it in the bigger layouts and not on a mobile, which is OK to me. On mobile it should take too much space.
But for design purposes it can be useful on the bigger screens.

You can add a new PopUp with the same photo but different size for mobile version.
The the button that opens the PopUp on bigger layouts must be duplicated.
The new duplicated button (only shows on mobile layout) has to be linked to that new resized PopUp.

You’re right with the buttons, but the suggestion was this:

Then it is the same popup.

Mr. F.

Thank you all for the help! For me it’s enough to be able to put an extra picture to the right or left side of the normal area of the website on the wider devices.
I think it will complicate things (and not nicer) on mobile to use it there. Waist of space.

Allright. Sorry.
But there is a solution for that as well.
Just create a new PopUp with transparent background.
Within this new PopUp place different elements (e.g. boxes, pictures, etc.).
And the elements make only visible for one device.
Each element can be in different size. Matching for the device.

1 Like

you are right, this is a solution. In my case however it’s not useful, because the space on a mobile for photos is very limited.
Nevertheless thank you all for the comments and the given solutions. It maybe will help a lot of others too.