Position of Navigation Bar

Classic Themes
1

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!

2

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
3

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?

4

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
5

Thanks Don! I really appreciate you taking the time.

1 Like
6

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