css代码:

.wrap{width:600px;margin:0 auto; overflow:hidden;}

.left{background:#ccc;width:300px;float:left;margin-bottom:-10000px;padding-bottom:10000px;}

.right{background:#eee;width:300px;float:left;margin-bottom:-10000px;padding-bottom:10000px;}

html 代码:<div class="wrap"><div class="left">左侧</div>< div class="right">右侧<br />右侧<br />右侧<br />右侧< /div></div>

说明:通过控制margin-bottom:-10000px;padding-bottom:10000px;这个样式,达到左右高度一致,实际上两边的高度在10000px范围内都可以保持一致,可以设置更高。

css控制父元素下的子元素自适应高度,且高度一致的更多相关文章

  1. jquery层级原则器(匹配父元素下的子元素)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. stylus选中hover元素的兄弟元素下的子元素

    stylus设置兄弟元素样式:鼠标浮动在 .video-li 元素上时,.video-li 兄弟中 .video-info 下的 .word 显示. .video-li &:hover ~ . ...

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

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

  4. CSS实现父元素半透明,子元素不透明

    CSS实现父元素半透明,子元素不透明. 很久以来大家都习惯使用opacity:0.5在新式浏览器里实现半透明,而对IE较旧的版本使用filter:Alpha(opacity=0.5)的滤镜来实现半透明 ...

  5. 【IE6的疯狂之十】父级使用padding后子元素绝对定位的BUG

    在前端开发中,经常会用到css的position:absolute来使层浮动,前通过left,top,right等属性来对层进行定位,但ie6对left,top,right等属性的解释和ie7,ie8 ...

  6. AngularJs中,如何在父元素中调用子元素为自定义Directive中定义的函数?

    最近一段时间准备使用AngularJs中的自定义Directive重构一下代码. 在这里说明一下,把自定义控件封装成Directive并不一定是要复用,而是要让代码结构更加清晰.就好像你将一个长方法拆 ...

  7. css 选择其父元素下的某个元素

    一,选择器 :first-child   p:first-child(first第一个 child子元素)(找第一个子元素为p) :last-child    p:last-child(last倒数 ...

  8. 当fixed元素相互嵌套时,父元素会影响子元素的层叠关系,最好不要嵌套使用fixed

    问题:fixed元素被另一个fixed元素包含的时候在chrome下fixed子元素的定位会受到父元素的影响. 解释:层叠关系是受层叠上下文影响的.文档中的层叠上下文由满足以下任意一个条件的元素形成: ...

  9. 父元素设置min-height子元素设置100%问题

    问题:父元素设置min-height子元素高度设置100%取不到值,这是因为子元素 div设置 height:100%: 只有当父级元素满足min-height:1000px;设置的条件才触发: 浏览 ...

随机推荐

  1. module require区别

    LUA modue require package 区别 2011-01-19 12:41:35|  分类: 默认分类 |  标签:lua  package  module  require  加载  ...

  2. LINQ 操作符(二)

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  3. (转)MVC语法-@helpers和@functions(Razor内定义函数)

    (转)MVC语法-@helpers和@functions(Razor内定义函数) 转自:http://www.mikesdotnetting.com/Article/173/The-Differenc ...

  4. java面对对象 关键字this super

    this:this是指向对象本身的一个指针,成员函数内部指向当前类的对象 其实this主要要三种用法: 1.表示对当前对象的引用! 2.表示用类的成员变量,而非函数参数,注意在函数参数和成员变量同名是 ...

  5. weblogic上部署应用程序

    weblogic上部署应用程序有三种方法: 一:修改配置文件config.xml在文件中加入如下代码片段: <app-deployment> <name>FAB</nam ...

  6. ng-click得到当前元素,angular.element()用法

    <!DOCTYPE html> <html> <head> <title></title> <script src="lib ...

  7. XAMPP下重置mysql密码

    安装XAMPP后,mysql默认是没有密码的,安全起见一般我们都会修改密码. 密码太多,经常会忘记密码,那么,我们可以通过通过以下步骤可以重置mysql密码. 步骤如下: 1. 停止mysql 2.  ...

  8. cocos2d-x中的Tiled地图

    cocos2d-x中的瓦片地图是通过tiledMap软件制作的,存档格式是.tmx格式.此软件的使用步骤简单总结如下: (1)制作瓦片地图 1 打开软件,软件界面如下图. 2. 新建地图(文件-> ...

  9. Spring中IoC - 两种ApplicationContext加载Bean的配置

    说明:Spring IoC其实就是在Service的实现中定义了一些以来的策略类,这些策略类不是通过 初始化.Setter.工厂方法来确定的.而是通过一个叫做上下文的(ApplicationConte ...

  10. MYSQL 关于索引的部分问题!

    1. PRIMARY KEY也可以只指定为KEY.这么做的目的是与其它数据库系统兼容.二来key 是index的同意词! 2. 在UNIQUE索引中,所有的值必须互不相同.如果您在添加新行时使用的关键 ...