1

ページを下にスクロールしてもサイドバーが固定位置に固定されるように、特定の背景色のサイドバーを設定しました。今まではすべて問題ないように見えましたが、唯一変更したのは、サイド バーに箇条書きが表示されないように list-style-type を削除することだけでした。わからない、途中で何かを台無しにしたのかもしれませんが、どこにあるのかわかりません!!

現在、リンクはヘッダーのすぐ隣に表示され、背景色はなく、位置も固定されていません。

何か案は？

<!--main container,
gives content area width and centers it horizontally--> <!--width of wrap will be subtracted from width of the browser window (its container)--> #wrap {
  width: 750px;
  margin: 0 auto;
  background: #FFFFFF;
  position: relative;
}
h1 {
  margin: 0;
  background: #cc9
}
#nav {
  padding: 5px 10px;
  background: #FFF;
}
#main {
  float: left;
  width: 480px;
  padding: 10px;
  background: #FFF;
}
h2 {
  margin: 0 0 1em;
}
<!--Setting position to fixed and margin-left will keep sidebar scrolling on page--> #sidebar {
  float: right;
  width: 200px;
  padding: 40px;
  background: #99c;
  position: fixed;
  margin-left: 520px;
}
#footer {
  clear: both;
  padding: 5px 10px;
  background: #cc9;
}
#footer p {
  margin: 0;
}
#nav ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
#nav li {
  display: inline;
  margin: 0;
  padding: 0;
}
#sidebar ul {
  list-style-type: none;
}
<!--links--> a:link {
  color: black
}
a:visited {
  color: blue
}
a:hover {
  font-weight: bold
}
a:active {
  font-style: italic
}
.topnavlink {
  clear: left;
  margin-left: 1em;
  font-size: 1.1em
}
.sidenavlink {
  font-size: 1em
}
.footer {
  clear: left;
}
<DIV id="sidebar">
  <ul>
    <li><a href="http://www.google.com">Google</a>
    </li>
    <li>
      <a href="mailto:something@google.edu">Email Me</a>
    </li>
</DIV>
</DIV>

<DIV id="footer">
  <P>&copy;Something 2012</P>
</DIV>
</DIV>
</BODY>

</HTML>

4

3 に答える 3

2

コメントは CSS であるべきではあり
/* comment */

ません。

<!--comment-->


また
、あなたの html には、追加</div>
のコードの一部であるためかどうかわからない余分な終了があるようです

于 2012-05-31T01:45:29.180 に答える
0

<ul>の</div>代わりに で終わります</ul>。それを修正すると、すべてが所定の位置に収まるはずです。

于 2012-05-31T01:40:21.037 に答える