1

これは単純なことであることはわかっていますが、コーディングが多すぎるため、何かがこれを妨げている可能性があります。コンテンツの両側に細いサイドバーを作ろうとしています。広告か何かに使われるかもしれません。

コードは次のとおりです。

<div id="content">
    <article>
       This is a test.
    </article>
</div>
    <aside id="space">
        Hello.
    </aside>

何か問題がありますか?

編集: 2 つのサイドバーではないことはわかっています。最初に 1 つの作業を行う必要があります (笑)。

役立つ場合は、CSS を次に示します。

#content{
    float: left;
    width: 1366px;
    height: 350px;
}
article {
    background: #F5F5F5;
    border: 1px solid grey;
    padding: 10px;
    margin: 0px 325px;
    height: 325px;
    width: 660x;
    -webkit-box-shadow: rgb(110,110,110) 5px 5px 100px inset;
}
#space{
    float: left;
    width: 20px;
    height: 40px;
    margin: 10px 0px;
    padding: 20px;
    background: #66CCCC
4

1 に答える 1

1

それはあなたが望むものですか?

HTML

  <aside id="left">
     left
  </aside>

  <div id="content">
     <article>
         This is a test.
     </article>
  </div>

  <aside id="right">
     right
  </aside>

CSS

  body {
      width: 80%;
      margin: 0 auto;
  }

  #left, #content, #right {
     float: left;

      text-align: center;
  }

  #left, #right {
      width: 15%;
      background-color: #eee;
  }

  #content {
      width: 70%;
      background-color: #aaa;
  }

http://jsfiddle.net/fYFX6/

必要に応じて、サイドバーにマージンを追加できます。

于 2012-12-12T19:01:35.523 に答える