html5-为什么用rem设置div的高度不起作用呀?

问题描述

为什么用rem设置div的高度不起作用呀? 2C
html {font-size: 62.5%;}
结果是10px
div {font-size: 1.2rem;height:3rem;}
最后结果是div文字大小是12px,但高度确实36px,而不是我想要的30px

各位大神,这是为毛呀???

解决方案

你有试过把div的内边距离padding归零吗?实在不行直接用height:30px;何必那么纠结啊

解决方案二:
直接用height:30px

解决方案三:
因为浏览器中最小字体是12px,所以就算html中设了10px,最终也会强制使用12px

时间: 2024-09-19 11:23:39

html5-为什么用rem设置div的高度不起作用呀?的相关文章

javascript获取设置div的高度和宽度兼容任何浏览器_javascript技巧

Javascript如何获取和设置div的高度和宽度,并且兼容任何浏览器?看代码: 复制代码 代码如下: <div id="div1" style="height:300px;width:200px;">http://www.itdos.com</div> <div id="div2" style="height:30px;width:20px;">http://www.itdos.com&

css设置div的高度自适应并到一定高度后显示滚动条

问题描述 css设置div的默认高度为50px,当div里面的内容很多时,div自适应增加高度,当高度达到200px时高度不再增加,而是让这个div显示滚动条.请问谁能告诉我怎么实现,谢谢! 问题补充:redstarofsleep 写道 解决方案 JS做的话,CSS不要设定高度,让它自适应.然后JS取这个DIV的高度,如果高度<50,则将高度设为50如果高度>200,则将高度设为200解决方案二:设置滚动条自动(即内容多时自动显示)然后,嘿嘿 两条CSS3搞定min-height:50px;m

js 获取div高度并重新设置div高度与宽度

 js 获取div高度并重新设置div高度与宽度 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.111cn.net/1999/xhtml"> <head> <me

css 样式 ,给div设置了最小高度 当内容溢出最小高度时 之前给容器div设置的样式没作用

问题描述 css 样式 ,给div设置了最小高度 当内容溢出最小高度时 之前给容器div设置的样式没作用 解决方案 DIV设置最小高度DIV设置最小高度为什么我的设置的div最小高度不对 解决方案二: 不懂你要问什么东东,代码也没有.. 解决方案三: 你用浏览器调式调式呢 解决方案四: 你用的是谷歌调试吗?

CSS教程:div设置float后高度不自动增加

本来想把这个题目修改为"闭合浮动元素"或"清除浮动元素",但想了一下,还是不修改为好.因为从这个题目我们可以更加容易的看出,如果您没有闭合(清除)浮动元素,它将造成的后果是-----div的高度不能自动增加. 言归正传 目前用来清除"闭合(清除)浮动"的方法,主要是一下四种: 1.    额外标签法 这种方法就是向父容器的末尾再插入一个额外的标签,并令其清除浮动(clear)以撑大父容器.这种方法浏览器兼容性好,没有什么问题,缺点就是需要额外的(

火狐浏览器中DIV的高度不随里面的内容增高而增高

  在IE浏览器中#main这个DIV可以正常显示,但在火狐浏览器中不能正常显示#main这个DIV,即#main这个DIV的高度不会随里面的内容的高度增加而增加.可用如下的办法解决: 在样式表中#main这个样式规则的下面建立如下样式规则即可: #main { padding: 10px; width: 800px; margin-top: 10px; margin-right: auto; margin-bottom: 10px; margin-left: auto; background-

基于jQuery实现左右div自适应高度完全相同的代码_jquery

在线演示:http://demo.jb51.net/js/2012/jquery_demo/jquery_div_autoheihet.htm完整代码: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns=&quo

CSS Div 最小高度在IE 6 和IE 7中的兼容性问题_经验交流

浏览器兼容问题-CSS Div 最小高度在IE 6 和IE 7中的兼容性问题 用CSS 的定义一个DIV的高度时,在IE 7浏览器下可以正常显示.但是在IE 6 中,height 在10px以下就无法定义了.这点跟表格有点类似.解决的方法如下: 法一:定义overflow属性.比如想定义一个高度为2px 的线条. <div style="height:2px;overflow:hidden;background:#000000;width:778px;"></div&

CSS技巧:解决div列高度自适的3种常用方法

css|技巧|解决 解决div列高度自适的方法有很多种,这里介绍三种最常用的方法给大家(下面所有例子以父main,子divleft.divright为例). 1.利用"clear:both"背景填充(推荐!!!) 这是使用最广泛的一种做法,我一直都用此方法解决div列高度自适问题.三行二列布局,主要内容在右边,网页宽度780px,左列240px,右列540px. CSS代码: #main{ width: 780px; margin: 0; background: url(bg.gif)