Hi, I am working on a simple site and exported the code to my test server. The navigation in Webflow works fine, but is a desaster on my server. See screenshots and links. What could be the problem?
Btw: I am new to Webflow, worked many years with Muse.
Here is my site Read-Only: https://preview.webflow.com/preview/neustart?utm_source=neustart&preview=cd3b06c386156d513df41da708419cc7
Here is the published version: http://08.design-test.info
Hi @kurt,
is this: http://08.design-test.info the test server?
it seems to behave exactly as the webflow read-only link.
Hi Aviv, it looks okay in the beginning, but as soon as I click on one menu button, it looks like in the screenshot. Navbar items move, background is grey instead of white … I checked it in Safari, will give try in Chrome
it looks a little better in Chrome. But when I use the dropdown, things shift, there is a grey space above and below the navbar, see screenshot
I believe it is has nothing to do with exporting the site. The grey background is probably a property for a smaller screen size.
Try to check all the breakpoints and make sure it works well for all screen sizes, and then export it.
Okay, thank you. I will look at it. I actually wanted to create a kind of horizontal “drop down” like here (done in Muse): http://03.design-test.info – when you klick on “Was wir anbieten” opens a second line of the menu and remains open as long as you are on one of these pages.
Can be easily achieved with interactions 
… okay I will have a look, thanky you for the tipp But for mobile and tablet? Using a default navbar and then work with display “none”
I am not sure what you mean, but the default navbar does some of the mobile work for you.
I looked into the navbar, it seems OK to me. On Chrome it looks fine, except when I press “Was wir anbieten” > “Betreuung”. All other menu buttons work fine. In Safari it goes strange, no matter which button I press. See two screenshots.
Also there is a blue color in the page link of the page I am on, which I cannot get rid of
sorry for being a bit unclear as English is not my mother tongue. I thought of using the interactions for the desktop version and to create a symbol for that. Then for tablet and mobile set display “none” to this. And have a default navbar working for mobile and tablet and set this to disply “none” for the desktop version. Or is this too complicated?
It is not complicated and it is something that can be done. I am not sure it is the best practice, but I also did that in the past.
Your english is great 
It sounds like you would do it differently now? What would be your suggestion for let’s say the most solid way. The problems with Safari and Chrome vs. Preview in Webflow I still don’t understand. Thank you for your comment on my English
I will try to have only 1 navbar for all screen sizes.
Maybe some elements in it will be hidden or displayed for different screens, but not the hole element.
I believe that if you give your navbar height it will solve some of the problems.
Thank you. I will finish for today and look into it again tomorrow. But there seem to be major browser problems. Two screenshots enclosed of the new files with a height for the navbar. Starting to put the “home/start” page together in Chrome looks okay, in Safari chaos.
Things are looking better today. This version https://neustart.webflow.io looks fine. On my testserver still some minor problems. I will just wait until they go away I will present the project on Monday. It is for a local refugee help initiative hence the modest, straight and simple look. I will use the webflow.io version for the presentation.
This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.
