CSS – 如何使嵌套的div居中?

前端之家收集整理的这篇文章主要介绍了CSS – 如何使嵌套的div居中?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
CSS新手.

我试图使用下面的代码中心嵌套的div

HTML

<html>
    <head>
        <title>My website</title>
        <link rel="stylesheet" type="text/css" href="css/main.css" />
    </head>
    <body>
        <div id="wrapper">
            <div id="formpanel">
                <div id="loginForm">
                </div>
            </div>
        </div>
    </body>
</html>

CSS

body {
    margin: 0;
    background : #90ADB7 url('images/background.png') repeat-x;
    font-family: verdana,sans-serif;
    font-size: 0.85em;

}

#wrapper {
    width: 960px;
    margin: 0 auto;
    border-style:solid;
    padding: 190px 0;
}

#formpanel {
    width: 400px;
    height: 400px;
    background-color: yellow;
    margin: auto;
}

#loginForm {
    margin: auto;
    width: 50%;
    height: 50%;
    background-color:blue;
}

问题是最里面的div(#loginForm)与外部div(#formpanel)的上边缘冲刷.我应该如何集中内部div?

截图

解决方法

你可以使用相对定位:

http://jsfiddle.net/a879W/

原文链接:https://www.f2er.com/css/242153.html

猜你在找的CSS相关文章