css 实现 左右div 等高, 同时父级div就是最高的子div的高度
原文地址: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>参考链接: <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> 参考链接: <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> 参考链接: <a href="http://blog.csdn.net/qinshenxue/article/details/44861695" target="_blank">纯css实现div左右等高</a></p>
css 实现 左右div 等高, 同时父级div就是最高的子div的高度的更多相关文章
- 【html/css】若母div设置了透明度,如何才能使得里面的子div不继承母div的透明度
用rgba的方式给母div设置透明度的话就不会影响子div的透明度了. 例: background: rgba(51, 51, 51, 0.5);
- 当父级是body时,子元素设置position:absolute;定位是根据body还是html呢?
position:absolute 元素相对最近的 position 为 absolute / relative / fixed 的祖先元素(包含块)定位,如果没有这样的祖先元素,则以初始包含块进行定 ...
- jquery获取元素(父级的兄弟元素的子元素)
一.获取父级元素 使用jquery获取父级元素: parent() 例如:$(this).parent('ul'); 二.获取同级元素 使用jquery获取同级元素:siblings() 例如:$(t ...
- 父级元素position:absolute,子节点也是absolute
当父级属性position是absolute,子节点也是absolute的时候,子节点是相对父级absolute的,举个例子 <div class="headManage"& ...
- JS 用window.open()函数,父级页面如何取到子级页面的返回值?
父窗口:<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> ...
- 子级用css float浮动 而父级div没高度不能自适应高度
子级对象使用css float浮动 而父级div不能自适应高度. 对父级div标签闭合</div>前加一个clear清除浮动对象. <!DOCTYPE html> <ht ...
- js变量在属性里的写法 常用mark 多个DL遍历添加一个父级DIV
标记用 js变量比如url链接一般都是a里面的href属性值 在js里单引号链接 以后再忘记就能有地方找了 例子: /* 添加1200 居中div 包裹 获取元素集合 上层元素100% * @ele ...
- 子div块中设置margin-top时影响父div块位置的解决办法
在css中设置样式时,通常会遇到用子div块margin中设置margin-top时,父div块中就会随着子div的margin-top,也会和子div执行相同的margin-top的位置样式 解决办 ...
- 父div的透明度不影响子div透明度
在设置div的透明度的时候如果设置了父div的透明度(opacity=0.8),那么子div的透明度也随着改变了,并且设置子div的透明度不起作用. 这种情况下可以使用rgba来设置父div的透明度: ...
随机推荐
- 易语言Dns缓存
一些与DNS解析有关的命令: ipconfig/displaydns -查看被缓存的域名解析 ipconfig/flushdns -清空DNS缓存 .版本 .DLL命令 DnsFlushR ...
- error: 40 - 无法打开到 SQL Server 的连接
服务器环境: 系统:windows2008 数据库:SQLSERVER2012 在与SQLServer建立连接时出现与网络相关的或特定与实例的错误.未找到或无法访问服务器.请验证实例名称是否正确并且S ...
- Python--错误SyntaxError: (unicode error) 'unicodeescape' codec can't decode bytes in position 2-3: truncated \UXXXXXXXX escape
Refer to:https://www.cnblogs.com/cyiner/archive/2011/09/18/2180729.html 用Python打开文件: fo=open("C ...
- 手把手:使用service principal连接Azure Media Service
在简书中查看,请点击我. 关于相关内容解释,请参考docs文档 https://docs.microsoft.com/en-us/azure/media-services/previous/media ...
- iview中,table组件在缩进时产生的bug。
问题描述: 在父元素因为缩进的关系撑开时,table组件不会因为父元素的撑开而自适应,问题如图 解决办法:在父一级的组件中使用table {width: 100% !important},强制使表格宽 ...
- adb 安装安卓包
1.搭建安卓环境,或者下载安装ADB工具 2.adb version检查是否安装成功 3.用数据线连上手机,并在手机中打开USB调试模式,使用adb devices 查看链接的设备 这样表示成功连接上 ...
- 如何使用油猴脚本不要vip就能观看各大视频网站如腾讯,爱奇艺等的vip视频
如何使用油猴脚本不要vip就能观看各大视频网站如腾讯,爱奇艺等的vip视频 首先打开谷歌商店(这里需要fq,如不能fq的小伙伴请看上面写的Chrome怎么访问外网) 搜索Tampermonkey,点击 ...
- FragmentXlistview
package com.example.lenovo.tablayout; /** * Created by lenovo on 2018/7/18. */ import android.os.Asy ...
- 使用CNN生成图像先验,实现更广泛场景的盲图像去模糊
现有的最优方法在文本.人脸以及低光照图像上的盲图像去模糊效果并不佳,主要受限于图像先验的手工设计属性.本文研究者将图像先验表示为二值分类器,训练 CNN 来分类模糊和清晰图像.实验表明,该图像先验比目 ...
- Visual Stdio2017 使用
1. 快捷键: https://www.cnblogs.com/happyzwt/p/7769129.html 2.