使用保证金:0自动,Div仍未居中

时间:2012-06-21 12:25:52

标签: html css css3

我试图将一个容器div放在我的背景中心,我通常没有任何问题。我通常只添加css“margin:0 auto;”。那么这个网站,我不知道为什么,它可能是MIME类型或CSS3或其他东西......但div不会居中。

这是我的HTML ...

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HEAD>
<TITLE>title</TITLE>
<link rel="stylesheet" type="text/css" href="style.css" />

    <BODY>
        <div class="container">
        </div>
    </BODY>
</HTML>

这是我的CSS ......

body {
    background-image: linear-gradient(left top, #000000 30%, #0000FF 90%);
    background-image: -o-linear-gradient(left top, #000000 30%, #0000FF 90%);
    background-image: -moz-linear-gradient(left top, #000000 30%, #0000FF 90%);
    background-image: -webkit-linear-gradient(left top, #000000 30%, #0000FF 90%);
    background-image: -ms-linear-gradient(left top, #000000 30%, #0000FF 90%);
    background-image: -webkit-gradient(linear, left top, right bottom, color-stop (0.3, #000000), color-stop(0.9, #0000FF));
    height: 100%;
    width: 100%;
    margin: 0;
    width: 0;
}

.container 
{
    margin-left: auto;
    margin-right: auto;
    position: relative;
    width: 940px;
    z-index: 0;
    width: 940px;
    top: -10px;
    height: 80%;
    background-color: #F0F8FF;
    border-radius: 0px 0px 35px 35px; 
    -moz-border-radius: 0px 0px 35px 35px; 
    -webkit-border-radius: 0px 0px 35px 35px; 
    border: 10px solid #696969;
}

请忽略我的CSS上可怕的格式。这不是它在文件中的方式,只是错误复制它。我最初测试的浏览器也是Chrome。

2 个答案:

答案 0 :(得分:5)

从css规则中的width: 0;中删除body,如下所示:

body {
    background-image: linear-gradient(left top, #000000 30%, #0000FF 90%);
    background-image: -o-linear-gradient(left top, #000000 30%, #0000FF 90%);
    background-image: -moz-linear-gradient(left top, #000000 30%, #0000FF 90%);
    background-image: -webkit-linear-gradient(left top, #000000 30%, #0000FF 90%);
    background-image: -ms-linear-gradient(left top, #000000 30%, #0000FF 90%);
    background-image: -webkit-gradient(linear, left top, right bottom, color-stop (0.3, #000000), color-stop(0.9, #0000FF));
    height: 100%;
    width: 100%;
    margin: 0;
}

答案 1 :(得分:0)

您没有HTML标记来启动文档,确定可能会产生问题