Position of Navigation Bar

Hi everyone,

I am currently working on a website using the Engineer theme. I am a beginner when it comes to Rapidweaver, so I am still trying to figure everything out. In the theme, the menu bar is right-oriented automatically. I wanted to make the menu bar left-oriented, so I was wondering if anyone has any CSS code to make this possible.

I do not have any add-ons, as I am working on an incredibly tight budget. I would really appreciate it if you guys could respond with any CSS code.

Thanks!

To apply this site-wide, under the Settings area in the left-hand inspector, go to Code and then CSS and paste the following code:

.navbar-nav.ml-auto {
   margin-left: 0 !important;   
}
1 Like

Thanks Don!

I was also wondering whether I could space the options on the menu out more?

I have been looking for an option for that, but I haven’t been able to find anything that would allow for space between the options.

Would you know any CSS code for this?

Replace the previous code with this.

Adjust the 50px in the second rule to suit your layout.

/* Engineer Theme - Position Nav items to the left */
.navbar-nav.ml-auto {
   margin-left: 0 !important;   
}
/* Space Nav items out */
.navbar-nav.ml-auto li {
   margin-left: 50px;   
}
/*Remove space from first Nav item */
.navbar-nav.ml-auto li:first-of-type {
   margin-left: 0px;   
}
4 Likes

Thanks Don! I really appreciate you taking the time.

1 Like

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.