Question

如何让hmenu选项集中在任何显示器上？（CSS中的简单中心不能在我们的网站上工作）。我试图研究选项，但我们的编码似乎有点复杂。

www.sleepstudymo.com

提前致谢。

唐

Answer 1

您需要从float: left;移除.sleep-hmenu并在text-align: center;上添加.desktop .sleep-nav：

.desktop .sleep-nav {
    width: 100%;
    padding-left: 2px;
    padding-right: 2px;
    text-align: center;
}
.sleep-hmenu {
    float: left; /*remove this*/
}

或者您可以display: flex;使用flex-wrap: wrap;与.desktop .sleep-nav元素margin: 0 auto ul.sleep-hmenu {/ 1}}：

.desktop .sleep-nav {
    width: 100%;
    padding-left: 2px;
    padding-right: 2px;
    display: flex;
    flex-wrap: wrap;
}
ul.sleep-hmenu {
   display: inline-block;
   vertical-align: bottom;
   padding-left: 5px;
   padding-right: 5px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0 auto;
}

hmenu的中心选项

1 个答案: