Center nav menu in middle of the page

时间:2018-02-03 11:22:42

标签: html css

Hi I need to center my menu to the middle of the page. I have always used this solution:

nav {
  background: blue;
  height: 80px;
  text-align: center;
  ul {
    list-style-type: none;
    text-align: center;
  }

  li {
    display: inline-block;
  }

  a {
    color: white;
    text-decoration: none;
  }
}

but it looks like it's little bit more on left side of the page. How do I center the nav to be right in the middle? With this solution the first letter starts right in the middle.

1 个答案:

答案 0 :(得分:1)

verify the list ul

it has a left padding or left margin

and for make sure test this code

  nav {
    background: blue;
    height: 80px;
    text-align: center;
    ul {
      list-style-type: none;
      text-align: center;
      margin: 0;
      padding: 0;
    }

    li {
      display: inline-block;
    }

    a {
      color: white;
      text-decoration: none;
    }
  }