Centering navigation bar on website?

Hi, so don’t know a whole lot about either HTML or CSS, but i had my site developed quiet awhile ago and am now making some changes. I have been pretty good going through it all and made it all to how i like it except for the navigation bar which is aligned to the right and can’t get it to be center aligned.
Here’s the site, don’t know what information you’d need to help fix this:
https://site5b89d8ef0cf45.enjin.com/

Hi, On the page you gave a link to you have an internal stylesheet.
Starting on line 211 you will find this ruleset

.navbar .inner {
    max-width: 1170px;
    margin: 0 auto;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: flex;
    justify-content: space-between;
}

You need to change it to justify-content:center
It worked when I did a live edit

.navbar .inner {
    max-width: 1170px;
    margin: 0 auto;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: flex;
    justify-content: center;
}

It will be best to set that stylesheet up as an external css file so the browser can cache it correctly, and then you can make edits to the css file only rather than all html files that might have that same internal css.

2 Likes

Thankyou very much!

This would be an example of linking to an external stylesheet with this sample text that goes in to your HTML at the top before the end of the <head> tag.
<link href="style/yourstylesheet.css" rel="stylesheet" type="text/css" media="screen">

Whereas the file, “yourstylesheet.css”, would go in the style folder in your root directory.
You take your current inline styles and put that text into the new CSS file and remove the inline styles from the HTML file.

You can also limit which styles you apply from using different stylesheets where they are applicable, i.e.: dropdownmenus.css, homepage.css, imagescroll.css, etc.

Maybe you already know that. :sunglasses:

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