Home > Web Front-end > HTML Tutorial > 怎么让两个DIV块,居中?_html/css_WEB-ITnose

怎么让两个DIV块,居中?_html/css_WEB-ITnose

WBOY
Release: 2016-06-21 09:08:01
Original
1343 people have browsed it


不知为什么会居左,如何让其居中
代码如下:
??????????
@media screen and  (max-width: 600px) {
    .heading,
    .container,{
        width: 400px;
    }
    .main{
        float: left;
        height: 600px;
    }

    .left,
    .right{
        float: left;
        height: 200px;
        width: 400px;;
        background-color: blue;
    }

    .main {
        width: 400px;
        overflow: scroll;
    }
    .heading{
        width:400px;
        height:153px;
    }
    .container {
        height: 600px;
    }

    header{
        font-size:.6em;
        font-weight: bold;
        width: 100%;
    }
    a{
        font-weight: bold;
        text-decoration: none;    /*decoration 修饰 装饰*/
    }
    header nav a{
        text-decoration: none;
        font-weight: bold;
    }
    header nav ul li a{
        display: block;/*和前面的inline,是不是冲突?*/
        float: left;
        padding: .1em 0.8em .1em;/*top right bottom*/
        border-right: .1em solid;/*每个链接的右边框*/
    }


回复讨论(解决方案)

把margin:0px auto;添加到div样式里面

去掉{float:left;}就居中了,
可是为什么,宽幅为960和600px的时候设置float:left;就正常?
当浏览器宽度是小于600设置float:left;就会这样?

去掉float:left;设置margin:0px auto;就行了

给你篇文章系统学习一下!
http://note.youdao.com/share/?id=f93315310f22d0d2f4103bcbd6dfc922&type=note

清浮动

margin:0px auto;

感觉浮动那个有问题,正在学,暂时想不出好办法。看其他大神的。

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template