html - 导航栏中的 Logo 未居中

Question

我遇到了一个问题，我的导航栏中间的 Logo 没有居中对齐。这是我的 jsfiddle:https://jsfiddle.net/8zekvxqz/

#navbar-primary .navbar-nav {
  width: 100%;
  text-align: center;
}

#navbar-primary .navbar-nav > li {
  display: inline-block;
  float: none;
}

#navbar-primary .navbar-nav > li > a > img{
  display: inline-block;
  float: none;
}

#navbar-primary .navbar-nav > li > a {
  color: green;
  font-size: 2em;
  font-family: 'Holtwood One SC', serif;
}

您可能需要调整 jsfiddle 窗口的大小才能看到我在说什么，因为目前没有媒体查询以默认的 jsfiddle 窗口大小重新组织菜单。

非常感谢您的帮助。

Answer 1

试试这个:

#navbar-primary .navbar-nav ul{ 
  list-style-type: none; 
  text-align: center; 
}
#navbar-primary .navbar-nav > li {
  display: inline-block;
}

我认为重新定位图像是多余的:

#navbar-primary .navbar-nav > li > a > img{
  display: inline-block;
  float: none;
}