原文地址:https://www.cnblogs.com/cbza/p/7145384.html

方法一: 通过父级overflow:hidden,  自己设置padding-bottom 和 margin-bottom来实现.(方法一亲测有效)

#wrap{
overflow:hidden;
width:1000px;
margin:0 auto;
}
#left,#center{
margin-bottom:-10000px;
padding-bottom:10000px;
}
#left{
float:left;
width:250px;
background:#00FFFF;
}
#center{
float:left;
width:500px;
background:#FF0000;
}

<p>参考链接:&nbsp; <a href="http://yanue.net/post-35.html" target="_blank"> 纯css实现div左右等高</a></p>

方法二: 使用 table-cell

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
.left,
.right {
padding: 10px;
display: table-cell;
border: 1px solid #f40;
}
</style>
</head>
<body>
<div class="wrap">
<div class="left">
left div
<br/>
<br/>
<br/>
<br/>
<br/>
</div>
<div class="right">right div</div>
</div>
</body>
</html>

<p>&nbsp;参考链接:&nbsp;&nbsp; <a href="http://blog.csdn.net/qinshenxue/article/details/44861695" target="_blank">纯css实现div左右等高</a></p>

方法三:使用css3盒模型

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
.wrap {
display: -webkit-box;
}
.left,
.right {
padding: 10px;
border: 1px solid #f40;
}
</style>
</head>
<body>
<div class="wrap">
<div class="left">
left div
<br/>
<br/>
<br/>
<br/>
<br/>
</div>
<div class="right">right div</div>
</div>
</body>
</html>

<p>&nbsp;参考链接: <a href="http://blog.csdn.net/qinshenxue/article/details/44861695" target="_blank">纯css实现div左右等高</a></p>

css 实现 左右div 等高, 同时父级div就是最高的子div的高度的更多相关文章

  1. 【html/css】若母div设置了透明度,如何才能使得里面的子div不继承母div的透明度

    用rgba的方式给母div设置透明度的话就不会影响子div的透明度了. 例: background: rgba(51, 51, 51, 0.5);

  2. 当父级是body时,子元素设置position:absolute;定位是根据body还是html呢?

    position:absolute 元素相对最近的 position 为 absolute / relative / fixed 的祖先元素(包含块)定位,如果没有这样的祖先元素,则以初始包含块进行定 ...

  3. jquery获取元素(父级的兄弟元素的子元素)

    一.获取父级元素 使用jquery获取父级元素: parent() 例如:$(this).parent('ul'); 二.获取同级元素 使用jquery获取同级元素:siblings() 例如:$(t ...

  4. 父级元素position:absolute,子节点也是absolute

    当父级属性position是absolute,子节点也是absolute的时候,子节点是相对父级absolute的,举个例子 <div class="headManage"& ...

  5. JS 用window.open()函数,父级页面如何取到子级页面的返回值?

    父窗口:<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> ...

  6. 子级用css float浮动 而父级div没高度不能自适应高度

    子级对象使用css float浮动 而父级div不能自适应高度. 对父级div标签闭合</div>前加一个clear清除浮动对象. <!DOCTYPE html> <ht ...

  7. js变量在属性里的写法 常用mark 多个DL遍历添加一个父级DIV

    标记用 js变量比如url链接一般都是a里面的href属性值 在js里单引号链接 以后再忘记就能有地方找了 例子: /* 添加1200 居中div 包裹 获取元素集合 上层元素100% * @ele ...

  8. 子div块中设置margin-top时影响父div块位置的解决办法

    在css中设置样式时,通常会遇到用子div块margin中设置margin-top时,父div块中就会随着子div的margin-top,也会和子div执行相同的margin-top的位置样式 解决办 ...

  9. 父div的透明度不影响子div透明度

    在设置div的透明度的时候如果设置了父div的透明度(opacity=0.8),那么子div的透明度也随着改变了,并且设置子div的透明度不起作用. 这种情况下可以使用rgba来设置父div的透明度: ...

随机推荐

  1. python学习笔记 18-4-11

    一.执行一个简单的代码 1.先创建目录 mkdir /home/dev 2.切换到目录 cd /home/dev 3.在目录下创建文件夹 vim hello.py 4.编辑文件内容 vim hello ...

  2. projects(好代码好工具)每天进步一点点

    1. 行人检测的,感觉这个代码不错,起码换个数据集测试也不错: https://bitbucket.org/shanshanzhang/code_filteredchannelfeatures 2. ...

  3. C# autocomplete

    前台代码 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runa ...

  4. Convolutional Neural Network Architectures for Matching Natural Language Sentences

    interaction  n. 互动;一起活动;合作;互相影响 capture vt.俘获;夺取;夺得;引起(注意.想像.兴趣)n.捕获;占领;捕获物;[计算机]捕捉 hence  adv. 从此;因 ...

  5. java效验只能为数字类型

    首先要import java.util.regex.Pattern 和 java.util.regex.Matcher /** * 利用正则表达式判断字符串是否是数字 * @param str * @ ...

  6. ArcMap复制粘贴问题

    ArcMap 10.2能进行复制,但是不能进行粘贴的问题: 前几天用朋友的ArcMap10.2时,偶然发现在编辑数据的时候,需要在不同的shp层之间操作,往往有时候可以复制,但是粘贴那一项是灰色的,经 ...

  7. 前端上传图片回显并用base64编码,后端做解码储存,存储图片路径在.properties文件中配置(以上传身份证照片为例)

    前端页面:<form id="kycForm" enctype="multipart/form-data"> <input type=&quo ...

  8. tnsping无法ping通的问题,TNS-12535 TNS操作超时 (服务器环境:window server 2008R2 数据库环境:oracle 11 g)

    今天新搭建一个测试用的数据库服务器,操作系统为WIN server 2008 r2 版本.系统内已安装oracle 11g database,数据库服务端已配置完毕,监听listener已开启. 我在 ...

  9. 1. Packet sniffers (包嗅探器 14个)

    十多年来,Nmap项目一直在编目网络安全社区最喜爱的工具. 2011年,该网站变得更加动态,提供打分,评论,搜索,排序和新工具建议表单. 本网站除了我们维护的那些工具(如Nmap安全扫描器,Ncat网 ...

  10. 服务程序在c#中的写法

    1.在VS.NET2003中新建一个WINDOWS服务程序的项目WinSrv_A. 2.更改SERVICE1.CS属性SERVICENAME为你所要建立的服务名称,在服务管理器->名称中你可以看 ...