Question

我正在学习如何在tutorial here之后创建一个自适应网站 - 这是我的demo project）但我遇到了问题：我无法在{{1}的右边放置任何内容在<ul>内。出于某种原因，当显示未设置为“无”时，所有内容（包括<nav>链接）都低于#pull和<nav>。我想在<ul>中的<ul>右侧的某个位置创建一个登录表单，我不能在我的生活中找出如何执行此操作。

我确定它只是一个基本的CSS定位问题，我无法弄清楚，因为我是新手，但我只需要在<nav>上放置更多内容，我无法弄清楚如何。

Answer 1

widht的限制是问题所在：看到班级nav ul有width: 600px;你需要在所有样式表中重新设计nav ul的宽度大小。

示例：https://www.dropbox.com/s/itz8j1aeyyyufbh/Screenshot%202014-01-02%2020.10.07.png

nav ul {
  height: 40px;
  margin: 0 auto;
  padding: 0;
  width: 700px;
}

Answer 2

您需要更改display属性，默认为block元素ul，使用该属性，您无法将元素放在一边。试试这个：

nav ul, nav > a#pull {
  display:inline-block;
  vertical-align:middle;
}

并保持水平对齐：

nav {
  text-align:center;
}

Answer 3

所有东西都低于标题，因为你的ul边有自动边距。如果你想把你的拉链放在右边，你不介意使用绝对定位你可以做这样的事情：

#pull {
 position: absolute;
 top: 0;
 right: 0;
}

CSS定位导航栏内部

3 个答案: