如何将<nav>粘贴到标题的右上角?

时间:2016-08-05 12:58:07

标签: html css web nav

我正在尝试设置新的主页,我正在使用以下代码:

menu {
  width: 100%;
  height: 60px;
  background: rgb(0, 0, 0);
  z-index: 2;
  position: fixed;
}
#content {
  margin: 0 auto;
  width: 1024px;
  height: 50px;
  padding: 5px 20px 5px 20px;
}
#content img {
  padding: 5px 10px;
  width: 130px;
  height: 40px;
  float: left;
}
nav {
  float: right;
  overflow: hidden;
  height: 50px;
  line-height: 50px;
  width: auto;
  right: 0em;
}
nav li {
  display: inline-block;
  list-style: none;
  color: rgb(255, 255, 255);
  font-family: 'Roboto Condensed', sans-serif;
  font-size: 1em;
}
nav li:not(:last-child) {
  margin: 0px 30px 0px 0px;
}
nav li a {
  text-decoration: none;
  color: rgb(255, 255, 255);
}
nav li a:hover {
  border-bottom: 1px solid rgb(209, 27, 14);
  text-decoration: none;
}
<menu>

  <div id="content">

    <a href="jeggon-racing.de">
      <img alt="Jeggon Racing" src="images/logo.png">
    </a>

    <nav>
      <ul>
        <li>
          <a href="#start">Start</a>
        </li>


        <li>
          <a href="#about">&Uuml;ber uns</a>
        </li>


        <li>
          <a href="#leistungen">Leistungen</a>
        </li>


        <li>
          <a href="#offers">Angebote</a>
        </li>


        <li>
          <a href="#galerie">Galerie</a>
        </li>


        <li>
          <a href="#bewertungen">Bewertungen</a>
        </li>


        <li>
          <a href="#kontakt">Kontakt</a>
        </li>
      </ul>
    </nav>
  </div>
</menu>

我有一个粘性标题,但是如果我调整浏览器的大小,则该元素不会粘在右侧(它没有响应)。我该如何解决这个问题?

1 个答案:

答案 0 :(得分:0)

我找到了解决方案:

我只需要更改#content {max-width: 1024px;}