1

相対/絶対位置の使い方を学んでいます。

しかし、私は少し立ち往生しています。

divをdiv内で水平方向に中央に配置しようとしていますが、追加margin: 0 auto;しても何も起こりません。

私はフィドルを作りました。

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

<!DOCTYPE HTML>
<html lang="en-UK">
    <head>
        <link href="DivTest.css" rel ="stylesheet" type="text/css">
        <title></title>
    </head>
    <body>
    <div id="header"></div>
    <div id="outer">
        <div id="inner"></div>
    </div>
    </body>
</html>

CSS:

body, html {
     margin: 0;
     width: 100%;
}

#header{
     position: relative;
     width: 100%;
     height: 200px;
     background-color: lightgreen;
     margin: 0 0 20px 0;
}

#outer{
     position: relative;
     width: 800px;
     height: 500px;
     background-color: red;
     margin: 0 auto;

}

#inner{
     position: absolute;
     width: 200px;
     height: 250px;
     background-color: lightblue;
     margin: 0 auto;
}

どんな助けでもいただければ幸いです。

4

1 に答える 1

3

position:absolute;のプロパティを削除するだけです#inner

フィドル: http: //jsfiddle.net/Q8NVH/7/

于 2012-08-12T18:15:14.310 に答える