I came across this site and I really dig the panel layout and content boxes. It works great from a responsive standpoint as well. I am guessing that to recreate it, flexblox will have to be used. Anyone have any suggestions / tip & tricks / or advice on how to recreate this?
https://www.reliablepsd.com/ultimate-google-font-pairings/
Thanks!
Here is my public share link: LINK
(how to access public share link)
Hey @kbowman,
I’m not sure why you would need flexbox for this site.
You need to remember flexbox is not fully support on every browsers, if you can don’t use it in my opinion.
I would use 100vh section in relative
container in absolute centered with css
And a two column inside
Thanks for the reply! What browsers don’t support Flexbox? I am currently using it on my site and I haven’t run into any issues when testing it.
Maybe this is simple, but I am a designer not a developer, so its a bit tricky for me. I would love to do it without Flexbox if possible though. I am trying to wrap my brain around how the the three content boxes are positioned within the bigger container. The small number box to the left but slightly down from the top, the second content box with the font info and then the bigger content box with the quote. How do you position those within the center container?
Can I use flexbox?
Excellent resource for that kind of questions 
Cool thanks for that link!
I’ve watched the videos and done the tutorials on Flexbox (even used it successfully on my site), but I am not a developer. I wish I had that skillset, but my brain just doesn’t work that way. I know enough to be dangerous to myself. The way that I learn best is by deconstructing something. If someone could mock this page up in Webflow, so I can see how it was built, then I could learn and get better. Unfortunately, I just wasted a whole day, trying to figure it out on my own and I am no closer than I started.
Is there anyone who would do me a favor and mock up this section up in Webflow, so I can understand how to build it? Maybe its Flexbox, maybe its absolute positioning…I don’t know, except that I am confused and frustrated.
I’ll see if I can make mock for you this weekend.
That would be amazing and a huge help in learning!
@kbowman here you are. Hope it helps you. Let me know if you get stuck and I’ll try to help.
Preview: http://full-height-one-page-layout.webflow.io/
Designer preview: https://preview.webflow.com/preview/full-height-one-page-layout?preview=877ccdfe5aa46a8460668ca7cd5bbb00
Edit: Due to a private conversation with me and Keith where I trying to solve some of Keiths issues the preview may change a bit.
Jorn,
I seriously can’t thank you enough! This is perfect and it should really help me understand how to design something like this in Webflow. Community forums are only as useful as the members who choose to participate. I can’t wait to dive in and see how this was made.
Thanks again!
This topic was automatically closed 125 days after the last reply. New replies are no longer allowed.
