0

これは私が取り組んでいる私のポートフォリオです

Webサイトに初めてアクセスするとき、黄色のWakeyカードはサイドバーの下にあります（サイドバーの右側にあるはずです）。

そして、ウェブサイトを更新した後、それは正しい位置になりますこれを引き起こしている可能性があるのは何ですか？

これは、カードが配置されているコンテンツdivのcssです。

     #content
{
    width:70%;
    position: absolute;
    display: inline-block;

}

そしてこれはサイドバーです

#sidebar
{
    background-color:#4b4b4b;
    margin:0px;
    margin-left:5%;
    width:400px;
    height:1000px;
    -moz-box-shadow: 0px 0px 25px #000000;
    -webkit-box-shadow: 0px 0px 25px #000000;
    box-shadow: 0px 0px 25px #000000;
    display: inline-block;
}

あなたはウェブサイトからhtmlを見ることができるので、私はそれを短くするためにそれを投稿しません

IEでは正しく表示されますが、Chromeでこの問題が発生します

更新：＃content-wrapperの表示をdisplay:inline;今に変更しましたが、役に立ちませんでした

4

1 に答える 1

1

サイドバーを浮かせてみませんか？そして、通常のドキュメントフローで#contentの位置自体を許可します。＃contentの幅も設定することをお勧めします。

#sidebar
{
  background-color:#4b4b4b;
  margin:0px;
  margin-left:5%;
  width:400px;
  height:1000px;
  -moz-box-shadow: 0px 0px 25px #000000;
  -webkit-box-shadow: 0px 0px 25px #000000;
  box-shadow: 0px 0px 25px #000000;
  float: left;

}

#content
{
 float: left;
}
于 2013-03-22T23:22:38.210 に答える