height:auto和height:100%的区别

简介:

一直不明白height:100%和height:auto的区别,最近在制作前端页面时都用了height:100%;overflow:hidden; ,可是有些浏览器出现莫名的奇妙的问题,但换成height:auto就好了,百度过这个问题,却一直没有细看。

今天又浮现了同样的问题,百度细看和群里的朋友指点,终于明白其中的道理,记录一下。

height:auto,是指根据块内内容自动调节高度。
height:100%,是指其相对父块高度而定义的高度,也就是按照离它最近且有定义高度的父层的高度来定义高度。

目录
相关文章
|
22天前
|
前端开发 容器
max-height 属性和 min-height 属性有什么区别?
【10月更文挑战第27天】`max-height`属性和`min-height`属性在控制元素高度方面各有特点和适用场景,通过合理地运用这两个属性,可以更灵活地实现各种页面布局效果,满足不同的设计和功能需求。
|
6月前
|
前端开发
line-height与height的区别
line-height与height的区别
61 0
IE6下面,为什么不能设置height:1px的元素
在用DIV构建网页的时候,有时候需要的高度很小,这时候就可能会出现问题,因为,IE6下DIV有个默认的高度,大约10-12px。当你试图定义一个高度小于这个默认值的 div 的时候, IE 会固执的认为这个层的高度不应该小于字体的行高。
82 0
html+css实战94-内容width和height
html+css实战94-内容width和height
105 0
html+css实战94-内容width和height
|
前端开发
CSS - 行内元素的 padding、margin、width、height、line-height 是否无效?
CSS - 行内元素的 padding、margin、width、height、line-height 是否无效?
514 0
CSS - 行内元素的 padding、margin、width、height、line-height 是否无效?
|
缓存 算法 iOS开发
Auto Layout (3)
Auto Layout 是怎么进行自动布局的,性能如何?
213 0
Auto Layout (3)
|
Android开发 容器
Horizontal viewport was given unbounded height.width.
Horizontal viewport was given unbounded height.width.
273 0
|
JavaScript 前端开发