0

次の HTML と CSS がありますが、IE にコンテンツを適切に表示させることができません。すべての組み合わせで中央と右の div が飛び出します。他のすべてのブラウザーでは機能しますが、IE では機能しません。

HTML:

<div id="container"> 
   <div id="left"> 
   </div> 
   <div id="middle">
        <div id="middleone"> 
        </div> 
        <div id="middletwo"> 
        </div> 
    </div> 
    <div id="right"> 
    </div> 
</div>

CSS は次のとおりです。

#container
    {
width: 1024px; 
height:170px;
margin:auto;

    }


#left
{
    width: 415px;
    height: 89px; 
    float: left; 
    margin-top: 45px;
    margin-left: 15px; 

}


#middle
{
    height: 152px; 
    width: 300px;
        overflow: auto; 
    margin-top: 15px;   
}


     #middleone
     {

     height: 152px; 
     float: left; 

     }


     #middletwo
     {

     height: 152px; 
     float: right;

     }


#right
{
float: right; 
height: 130px; 
width: 260px;
margin-top: -132px;
margin-right: 10px; 
}
4

1 に答える 1

1

次のことを試してください。

#left {
    float: left;
}
#middle {
    float: left;
}
#right {
    float: left;
}

中央または「中央」のコンテナにフロートがないようです。「左」と「右」のコンテナがフローティングされている場合、「中央」もフローティングする必要があります。そうしないと、レイアウトが崩れます。次のこともできます。

#left {
    float: left;
}
#middle {
    float: left;
}
#right {
    float: right;
}

コードが示すように、そのコンテナーを右側に配置する理由がある場合。要するに、「中間」コンテナにはフロートが必要です。

于 2012-12-06T13:23:25.627 に答える