解决方法:

1.在父元素上加:overflow:hidden.

2.给父元素加border;

3.外容器上加上padding。

如何解决子元素设了margin-top之后父元素所受的影响的更多相关文章

  1. 解决子元素设置margin-top,效果到父元素上的问题

    有时当我们设置子元素的margin-top,但是却发现子元素没有出现上外边距的效果,反而是父元素出现了上外边距的效果. 这种问题的解决方法如下: 1.给父元素加边框. 2.给父元素设置padding- ...

  2. margin传递,子元素的上下margin会传递给父级

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  3. 子元素增加margin-top会增加给父元素的问题

    假设我们有如下代码 <div id="father" style="height:400px;width:400px;background:#e4393c;&quo ...

  4. 当fixed元素相互嵌套时chrome下父元素会影响子元素的层叠关系

    问题:fixed元素被另一个fixed元素包含的时候在chrome下fixed子元素的定位会受到父元素的影响. demo(http://jsbin.com/qumah/1): <!DOCTYPE ...

  5. CSS| 解决子级用css float浮动 而父级div没高度不能自适应高度

    解决子级用css float浮动 而父级div没高度不能自适应高度 解决子级对象使用css float浮动 而父级div不能自适应高度,不能被父级内容撑开解决方法,父级div没有高度解决方法. 最外层 ...

  6. 为什么子元素设置margin-top会作用在父元素上?

    原因在于:CSS 外边距合并 复现: <!DOCTYPE html> <html lang="en"> <head> <meta char ...

  7. js进阶 11-19 jquery如何查找选择器的第一个父亲元素和第一个定位的父元素

    js进阶 11-19 jquery如何查找选择器的第一个父亲元素和第一个定位的父元素 一.总结 一句话总结:closest()方法获得匹配选择器的第一个祖先元素,从当前元素开始沿 DOM 树向上.of ...

  8. CSS关于子元素设置了float属性后父元素高度为0的解释和解决方法

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...

  9. 【转载】设置event.cancelBubble,使触发子元素的onclick不同时触发父元素的onclick

    由于HTML中的对象都是层次结构,比如一个Table包含了多个TR,一个TR包含了多个TD Bubble就是一个事件可以从子节点向父节点传递,比如鼠标点击了一个TD,当前的event.srcEleme ...

  10. 解决内部元素onMouseOver/onMouseOut事件冒泡触发父元素的相应事件

    前阵子为BS项目模板做了一个左侧滑动信息栏,效果类似于windows状态栏的自动隐藏效果,鼠标移进滑出,鼠标移出隐藏,浮动时不占用空间,也可以固定住占一块位置.做的过程中遇到一个问题,鼠标在信息栏内部 ...

随机推荐

  1. Swift设置textView的行间距

    let textview = UITextView(frame: CGRect(x: 100, y: 100, width: 100, height: 200)) let paraph = NSMut ...

  2. CSS3 笔记三(Shadow/Text/Web Fonts)

    CSS3 Shadow Effects text-shadow box-shadow 1> text-shadow The text-shadow property adds shadow to ...

  3. UITableView heightForHeaderInSection遇到的坑

    出现这种现象只需要把 heightforfoot改为0.01 - (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSectio ...

  4. angular中不同controller传值问题

    利用angularJS中service单例模式的特性,服务(service)提供了一种能在应用的整个生命周期内保持数据的方式,能够在控制器之间进行通信,且能保证数据的一致性. 一般我们都会封装serv ...

  5. video 播放

    视频播放是个坑... HTML5 Video API : https://www.w3.org/2010/05/video/mediaevents.html 虽然界面很丑,但是事件.属性很全. 进行视 ...

  6. Java程序员们最常犯的10个错误

    将数组转化为一个列表时,程序员们经常这样做: List<String> list = Arrays.asList(arr); Arrays.asList()会返回一个ArrayList对象 ...

  7. ubuntu host备份 ubuntu无法解析主机

    /etc/hosts # Copyright (c) 2014-2016, racaljk.# https://github.com/racaljk/hosts# Last updated: 2016 ...

  8. 软件工程(C编码实践篇)总结

    陆伟丹 + 原创作品转载请注明出处 + <软件工程(C编码实践篇)>MOOC课程http://mooc.study.163.com/course/USTC-1000002006 对软件工程 ...

  9. sprint2的总结及团队贡献分

    本次sprint做了订餐方法,用户可以通过搜索餐桌号进行点餐,查看已点的东西,也可以删除自己不想要的,当订单进入厨房时,厨房根据订单的顺序先后排列做餐,用户也可以通过扫描餐桌的二维码进行点餐. 148 ...

  10. CSUOJ_1001

    /* * Title : A+B(II) * Data : 2016/11/09 * Author : Andrew */ #include <iostream> #include < ...