zoukankan      html  css  js  c++  java
  • margin-top无效的问题解决方法

    今天碰到了margin-top无效的问题,解决方法也有很多一行代码就解决了

    解决办法:

    1.设置父元素或者自身的display:inline-block;(IE6、IE7不识别inline-block但可以触发块元素。具体方法请搜索)
    2.给父容器box加overflow:hidden;属性
    3设置父元素的border:1px aqua solid;(只要边距大于0即可)
    4.用父容器box的padding-top代替margin-top
    5.该盒子加浮动;
    6.给父元素或者自身设置position:absolute;;
    7、设置父元素非空,填充一定的内容;

    8、设置父元素的padding:1px;(只要参数大于0即可)




    依据:
    《on having layout》
    hasLayout 会影响一个盒子和其子孙的边距重叠。根据规范,一个盒子如果没有上补白和上边框,那么它的上边距应该和其文档流中的第一个孩子元素的上边距重叠。

    其他:
    但值得一提的是,只有在FF和Chrome下才会出现这种margin-top绑架父节点的情况,在IE6 IE7中均显示正常,但这恰恰说明了他们是不符合规范的,而FF合Chrome则是严格遵守规范的。

  • 相关阅读:
    二维数组和指向指针的指针
    多路复用构建高性能服务器
    disque概要
    漫谈云计算与SOA (1)
    zeromq
    自定义内存分配
    基于行的操作
    反应器类型的操作
    多个流,简短的读和写
    缓存
  • 原文地址:https://www.cnblogs.com/webqiand/p/4453594.html
Copyright © 2011-2022 走看看