修复我的导航栏

我正在研究导航栏，遇到了问题。这是我当前的输出。我将组浮动在右侧的右侧，但我希望所有内容都在同一行上。我该怎么做？

nav {
margin: 0px 10%;
}
#floatedright {
float: right;
}
#floatedright > li {
float: left;
}
</style>
<body>
<section id="headercontainer">
  <nav>
    <ul>
        <li><a href="#">PiercaNrla</a></li>
        <section id="floatedright">
            <li><a href="#">Home</a></li>
            <li><a href="#">Events</a></li>
            <li><a href="#">Contact</a></li>

你想得到这样的东西吗？

<body>
  <style>
    nav {
      margin: 0px 10%;
    }
    #floatedright {
      float: right;
    }
    #headercontainer ul li {
      display: inline-block;
    }
  </style>
  <section id="headercontainer">
    <nav>
      <ul>
        <li><a href="#">PiercaNrla</a></li>
        <section id="floatedright">
          <li><a href="#">Home</a></li>
          <li><a href="#">Events</a></li>
          <li><a href="#">Contact</a></li>
        </section>
      </ul>
    </nav>
  </section>
</body>

我拿了你的代码片段并试图把它拼凑在一起，因为有一些缺失的结束标签。希望我猜对了。如果您提供整个代码，我可能会更有帮助。

相关内容

最新更新

热门标签：