Center menu after exporting to RSD - Post ID 268313
I tried to export a template menu (just to get to know the program and effects) but the menu seems to stay at the left of the screen.
I tried it with a container + HTML and a column + HTML but still no luck. What am I doing wrong?
Can you share a link to your page?
It's easy to overlook something you're not looking for.
Here's my S-Drive site with
examples of what can be accomplished in VSD.
Here's my CoffeeCup SCCP Shop with examples of what can be done.
This is a site I built for my work.(RSD)
This is a site I built for use in my job.(HTML Editor)
This is my personnel site used for testing and as an easy way to share photos.(RLM imported to RSD)
I made the menu in the MenuBuilder, exported it and added it to RSD, I didn't edit anything outside those programmes.
Here is what I did:
In MB: I made a wide menu, wide enough to cover a normal-sized desktop screen. As far as I remembered from your earlier posts, you had 6 menu buttons, so I added two to the default setup.
I gave the menu background a colour in order to see where it is.
Then I adjusted the left and right margins of the buttons to spread them out as much as possible to cover the menu background (I could possibly have given the left-most button a wee bit extra left margin).
I narrowed the viewport and set a breakpoint a little before the buttons started looking squashed, then switched to 'Layout for small screens'. If the menu wasn't supposed to have a background colour, it can be taken away at this point.
Finally saved and exported the menu.
In RSD: I added the folder inside the exported menu folder to the ressources.
I popped a container into the one row. (I think I could have done without that container too...)
Then I popped a html element into the container. Into that html element I copy/pasted the body contents of the menu html file.
I also had to open the settings tab and add the head contents of the menu html file into the head of the RSD file.
Saved and exported.
That was it. Don't preview in RSD, preview in a browser.
If you want the menu buttons to sit tighter together on a wide screen, then you will have to reduce the margins between the buttons and add more to the outside margins (on the first and the last button). Do that while you still have the background colour.
@Eric link is above. I added a center tag to the html pane but still not centered
The reason why it is not centered is because you can't see the menu background behind the buttons, and therefore you don't know where it is. That is why I said give it a colour. Check the attachment, the longish rectangle around the buttons is the background. You need to push your buttons to the right, by using a left margin on the first button.Then you need to adjust it again for the middle view.
I have a blank RSD page with 2 rows. The top row is empty. The 2nd row I added a column and an html element into that column for the nav.
Imported the MB menu via copy paste in the header;
added the resources (not the *-exported) as a primary folder
copied the html from MB into the html element.
All I have is a vertical menu which is supposed to be horizontal with sub menus.
I don't understand the Class/ID designations in MB and how to translate that into RSD.
Thank you. http://newurbanpantry.com/test2/
But now I have a new problem. that last link was supposed to be an absolute path. I triple checked it. it was overwritten and that is not okay
I see you have got the menu centered.
If you narrow the viewport down below 400px width, the menu items start colliding, so you need toset a breakpoint and switch to the collapsed layout, which is recommended for small screens, at about 500px width to avoid that.
Not sure about that overwriting of the full url on the last menu item. The code doesn't show any link at all, so I don't know how that has happened. I would need to see your .mb file.
Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.