父div高度不能自适应子div高度的解决方案
<div id="parent">
<div id="content"> </div>
</div>
当content内容多时,即使parent设置了高度100%或auto,在不同浏览器下还是不能完好的自动伸展。解决方案如下:
<div id="parent">
<div id="content"></div>
<div style="font: 0px/0px sans-serif;clear: both;display: block"> </div>
</div>
在层的最下方产生一个高度为1的空格,可解除这个问题。
另外还有这样写的:<div style="height:1px; margin-top:-1px;clear:both;overflow:hidden;" />或者<br style="clear:both;" />。
父div高度不能自适应子div高度的解决方案的更多相关文章
- js在一个div里面移动其子div
var ChildDiv = $("#cid"); var width = 0; //鼠标点击子div的地方和子div的左边边距距离 var height = 0; //鼠标点击子 ...
- CSS中父元素高度没有随子元素高度的改变而改变,应该如何解决?
如果子元素没有设置浮动(float),父元素实际上会根据内容,自动宽高进行适应的. 当子元素增加了浮动后,最简单的处理方法是给父元素添加overflow:hidden属性,此时父元素的高度会随子元素的 ...
- 总结iframe高度自适应,自适应子页面高度
在网上找了很多iframe的高度自适应,发现很多兼容性都不是很好,于是自己总结了一下. 页面html节点上要有 <!DOCTYPE html PUBLIC "-//W3C//DTD ...
- 如何在一个div中使其子div居中
网上其他地方已讲述过对其的不同实现方式,今天主要做一个详细的汇总,希望对大家有帮助. ps:我面试的时候就被问到过这个问题,当时都回答错了,蓝瘦. 假设父div的类名为father,子div的类名为s ...
- div+css 左右两列自适应高度 ,以及父级div也跟着自适应子级的高度(兼容各大浏览器)
<style type="text/css" media="screen"> <!-- #main {width:500px;_height: ...
- 父div高度不能根据子div高度自动变化的解决方案
<div id="parent"> <div id="content"> </div> </div> 当cont ...
- css 实现 左右div 等高, 同时父级div就是最高的子div的高度
原文地址:https://www.cnblogs.com/cbza/p/7145384.html 方法一: 通过父级overflow:hidden, 自己设置padding-bottom 和 mar ...
- iframe高度自适应,自适应子页面高度
html <iframe id="mainFrame" name="mainFrame" scrolling="no" src=&qu ...
- 如何设置自适应当前浏览器高度的div块
嗯 就是下面这样 <!DOCTYPE html> <head> <title>adaptive this page size</title> <s ...
随机推荐
- TP关联模型
<?php class ExpertiseModel extends RelationModel { protected $_link=array( 'Role'=> array( 'ma ...
- 《解读window核心编程》 之 字符和字符串处理方式
推荐的字符和字符串处理方式 開始将文本字符串想象为字符的数组,而不是 char 或字节的数组. 用通用数据类型(如 TCHAR/PTSTR )来表示文本字符和字符串. 用明白的数据类型(如 BYTE ...
- iOS网络_优化请求性能
iOS网络_优化请求性能 一,度量网络性能 1,网络带宽 用于描述无线网络性能的最常见度量指标就是带宽.在数字无线通信中,网络带宽可以 描述为两个端点之间的通信通道每秒钟可以传输的位数.现代无线网络所 ...
- 给singer的左侧添加fixedTitle,并显示向上滚动偏移效果;
1.将写好的dom绝对定位到顶部: 2.dom值为singerlist的currentIndex.title(通过计算属性获取),如果有则显示fixedTitle,没有则隐藏: 3.计算diff:当d ...
- 配置maven为阿里云加速
<repositories> <repository> <id>nexus-aliyun</id> <name>Nexus aliyun&l ...
- LeetCode: Divide Two Integers 解题报告
Divide Two Integers Divide two integers without using multiplication, division and mod operator. SOL ...
- Servlet入门(第一个Servlet的Web程序)
新建maven项目,注意项目的类型 project名为ServletExample 点击Finish.建立maven项目完毕例如以下 生成后的文件夹没有java源代码文件夹.依照maven的约定,还要 ...
- PHP简单工厂模式、工厂方法模式和抽象工厂模式
PHP工厂模式概念:工厂模式是一种类,它具有为您创建对象的某些方法.您可以使用工厂类创建对象,而不直接使用 new.这样,如果您想要更改所创建的对象类型,只需更改该工厂即可.使用该工厂的所有代码会自动 ...
- 【WPF】设置TextBox内容为空时的提示文字
<TextBox Width="150" Margin="5"> <TextBox.Resources> <VisualBrush ...
- CAS (2) —— Mac下配置CAS到Tomcat(客户端)
CAS (2) -- Mac下配置CAS到Tomcat(客户端) tomcat版本: tomcat-8.0.29 jdk版本: jdk1.8.0_65 cas版本: cas4.1.2 cas-clie ...