I’m trying to recreate this site in Webflow but I am having trouble re-creating this nav… Can someone help? Any advice on exactly how to do this?
@sabanna I mean like with the logo in the middle and the nav buttons half on one side and half on the other. Here’s how I have it set up so far but when I make the screen smaller half the nav disappears…
https://preview.webflow.com/preview/flowers-on-the-park?preview=de106b47e22fe92b6a4a9549362e0420
Ok, I understood what you are trying to do.
It is how I would do this:
-
Change navlinks to regular link-blocks+text nad give them the same class (navlink)
-
Leave only 1 navmenu and make it width: 100%
-
Add row with 3 columns to navmenu
-
Move first 3 navlinks into the first column and second 3 navlinks into the last column, middle column will stay empty.
-
Make navdiv position:relative and logo link position: absolute, then put logo link in the middle.
You would get something like this:
-
Then, for the tablet and smaller devices, make navmenu position: absolute, row make stuck in one column and all navlinks display: block. Then you will get something like this:
Hope I was able to explain.
Cheers,
Anna
@sabanna oh thank you so much! I feel like such a beginner still but there’s so much different situations you can come up with! You are such a life saver!
You are welcome Sometimes crazy ideas may save situation too
@Sabanna Another question since you are super helpful! On the website I am recreating there is a cell phone that flips when hovered over. How can I achieve this as well? Is there a way to turn the phones sideways like the website without editing them in a photo editor?
To have it flip you could do it with interactions. To have it open like a flip phone would be 3D animations.
@VladimirVitaliyevich there’s 3D Animations on Webflow? How would I do that?
Yup. Watch the tutorials. There’s too much for me to explain all the things you could do. Here’s an intro.
@VladimirVitaliyevich awesome thank you!
This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.