CMS Layout struggle

Design help Layout & Design
1

Hey there !

I made this layout on figma for a portfolio page

image
image851×918 133 KB

Now that i try to get it on Webflow, i got multiple issues and i’d like to read your opinions and suggestions about it and how to achieve it, if it is even possible

The first struggle is about the kind of border of the image, i tried with a div block, border of 1px, same shape than the image, relative position, but the responsiveness is all broken it does weird things, i probably do something wrong but i don’t know what yet… I wonder how you would achieve such a thing ?

The second is that if i create a CMS list, i can’t see how i would be able to achieve the changing layout of my figma design (first project with image left/content right – second project with content left/image right etc…), cause if i change something in the CMS list, it applies to the entire list… is it even possible to reach my Figma’s result on this topic ?

I hope you understand my english and my explainations :smiley: I can’t wait to read your responses about it !

Thank you for your time

2

For the border - could you create a solid image with your background color and border locked together, with a transparent window. Then layer that on top of your image div using positioning?

Screen Shot 2022-09-01 at 11.12.51 AM
Screen Shot 2022-09-01 at 11.12.51 AM1090×1446 214 KB

1 Like
3

Hey,

This is actually a good idea i did not think of ! Thank you for sharing it !

I managed to solve this problem using relative and absolute position, i’m putting the read-only link below, i still got the layout issue, i think i need some custom code to solve this

Link to the Read-only mode

1 Like