Question

我是一名使用CSS的业余爱好者，并尝试过使用一些指南让自己到目前为止。我为那些可能知道我做错了什么的人设置了一个小提琴http://jsfiddle.net/defaye/X9t7M/1/？我无法将右侧的侧边栏作为主要内容的最右侧列。

CSS结构

#wrapper {
  width: 100%;
  min-width: 950px;
  max-width: 1110px;
  margin: 0 auto;
}

#header {
  float: left;
  height: 354px;
  width: 100%;
}

#navigation {
  float: left;
  height: 40px;
  width: 100%;
}

#container {
  float: left;
  width: 100%;
}

#main {
  margin-right: 200px;
}

#sidebar {
  width: 300px;
  margin-left: -300px;
  float: left;
}

#footer {
  height: 40px;
  width: 100%;
  clear: both;
}

HTML结构

<body>
  <div id="wrapper">
    <div id="header"></div>
    <div id="navigation"></div>
    <div id="container">
      <div id="main"></div>
      <div id="sidebar"></div>
    </div>
    <div id="footer"></div>
  </div>
</body>

Answer 1

看看this fiddle它是如何运作的。这是your updated fiddle

#main, #sidebar {
    float: left;
}

#main {
    width: 70%;
}

#sidebar {
    width: 30%;
}

无法将我的侧边栏放在右侧

1 个答案: