如何将此菜单对齐/浮动到右侧?

时间:2015-01-07 20:24:43

标签: html css

您好我如何将此菜单对齐/浮动到右侧我发现了一些其他问题,其中大多数人说要添加' display:block;漂浮:对;'到导航ul线,所以我只是添加了它,我发现了ul,但是没有工作,对不起,这很新!

提前致谢...



/*  header : nav header
/* ------------------------------------ */

#nav-header.nav-container {
  background: transparent;
  z-index: 97;
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 -1px 0 rgba(0, 0, 0, 0.2), inset 1px 0 0 rgba(0, 0, 0, 0.2), inset -1px 0 0 rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 -1px 0 rgba(0, 0, 0, 0.2), inset 1px 0 0 rgba(0, 0, 0, 0.2), inset -1px 0 0 rgba(0, 0, 0, 0.2);
}
#nav-header .container {
  padding: 0 15px;
}
#nav-header .nav-toggle {
  background: transparent;
  color: #fff;
  font-size: 15pt;
  -webkit-box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.05), -1px 0 0 rgba(0, 0, 0, 0.2);
  box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.05), -1px 0 0 rgba(0, 0, 0, 0.2);
}
#nav-header .nav-text {
  color: #fff;
  font-size: 15pt;
  color: rgba(255, 255, 255, 0.7);
}
@media only screen and (min-width: 720px) {
  /* common */
  #nav-header .nav {} #nav-header .nav li a {
    color: #fff;
    font-size: 15pt;
    color: rgba(255, 255, 255, 0.7);
  }
  /* level 1 */
  #nav-header .nav > li {
    border-right: none;
  }
  #nav-header .nav > li > a:hover,
  #nav-header .nav > li:hover > a {
    background: rgba(0, 0, 0, 0.1);
  }
  #nav-header .nav li > a:hover,
  #nav-header .nav li:hover > a,
  #nav-header .nav li.current_page_item > a,
  #nav-header .nav li.current-menu-item > a,
  #nav-header .nav li.current-menu-ancestor > a,
  #nav-header .nav li.current-post-parent > a {
    color: #fff;
    font-size: 15pt;
  }
  /* level 2 & 3 */
  #nav-header .nav ul {
    background: #33363b url(img/opacity-10.png) repeat;
    display: block;
    float: right;
  }
  #nav-header .nav ul li {
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06);
    -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06);
    display: block;
    float: right;
  }
  #nav-header .nav ul li:last-child {
    box-shadow: none;
    -webkit-box-shadow: none;
    display: block;
    float: right;
  }
}
@media only screen and (max-width: 719px) {
  /* common */
  #nav-header.nav-container {
    border-left: 0;
    border-right: 0;
  }
  #nav-header .container {
    padding: 0;
  }
  #nav-header .nav {
    padding-bottom: 20px;
  }
  #nav-header .nav li a {
    color: #fff;
    font-size: 15pt;
    color: rgba(255, 255, 255, 0.8);
    border-top: 1px solid rgba(255, 255, 255, 0.06);
  }
  /* level 1 */
  #nav-header .nav li > a:hover {
    background: rgba(0, 0, 0, 0.15);
    color: #fff;
    font-size: 15pt;
  }
  #nav-header .nav li.current_page_item > a,
  #nav-header .nav li.current-menu-item > a,
  #nav-header .nav li.current-post-parent > a {
    background: rgba(0, 0, 0, 0.15);
    color: #fff;
    font-size: 15pt;
  }
}

<nav class="nav-container group" id="nav-header"> 
  <div class="nav-toggle">
    <i class="fa fa-bars"></i> *Menu icon*
  </div> 
  <div class="nav-text">
  Menu Content
  </div> 
  <div class="nav-wrap container"> 
  </div> 
</nav>
&#13;
&#13;
&#13;

导航标题我试图正确对齐

0 个答案:

没有答案