css因float引起div高度自适应无效解决方法

 代码如下 复制代码

<style>
#main{float:left;min-height:500px;}
#l{float:left;margin-bottom:10px;margin-right:10px;padding:6px 10px;width:117px;}
#r{float:right;margin-right:10px;padding-top:10px;width:864px;overflow:hidden;}
</style>
 
<div id="main">
  <div id="l"> 标题区域 </div> 
  <div id="r"> 内容区域</div> 
</div>

注:最重要的是利用了overflow:hidden 不加这个就不会有效加了overflow:hidden它在当前css中不是自动隐藏的意思了。

时间: 2024-09-21 00:26:39

css因float引起div高度自适应无效解决方法的相关文章

css float 高度自适应无效解决方法

怎么解决这个问题呢?经发现可以采用overflow来解决!方法是在父元素加上如下代码即可: overflow:auto;zoom:1; "overflow:auto;"是让高度自适应,"zoom:1;"是为了兼容IE6,也可以用"height:1%;"来解决.  代码如下 复制代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h

css div 高度自适应

  css div 高度自适应其实初学者经常会碰到此类的问题,记得我以前就碰过这样的问题喽,问了好多朋友都没办法在foxfir 与ie下同时让div高度自适应,下面是我经过反应的试验得出来了代码. .all_block{   width:900px;   margin:0px auto;   padding:12px 10px 0px 10px;   background-color:#FFFFFF;     clear:both; position:relative;overflow:auto

iframe窗口高度自适应的实现方法

 这篇文章主要介绍了iframe窗口高度自适应的实现方法,有需要的朋友可以参考一下 domainA 中有一个页面index.html,通过iframe嵌套了domainB中的一个页面other.html 由于other.html页面在iframe中显示,而且其页面内容会动态的增加或减少,现在需要去掉iframe的滚动条 由于javascript同源策略的限制,无法进行跨域操作,使得问题比较棘手 参考了一下网上的做法,引入了一个代理页面,或者叫做中介 agent.html,属于domainA 然后

ie7中 iframe.style.height=&quot;100%&quot; 无效解决方法

ie7中 iframe.style.height="100%" 无效解决方法 100%高度的iframe在ie7中显示错误,原因是iframe.style.height="100%".       1.设置iframe父容器的高度值,100%就能生效(由此猜测默认情况下iframe的父容器高度是某个比较小的值,因此显示出来高度比较小)       2.如果是脚本动态创建的,iframe.style.height=document.body.scrollheight

C# 回发或回调参数无效解决方法

c# 回发或回调参数无效解决方法 突然出现了错误:"回发或回调参数无效.在配置中使用 或在页面中使用 <%@ page enableeventvalidation="true" %>启用了事件验证.出于安全目的,此功能验证回发或回调事件的参数是否来源于最初呈现这些事件的服务器控件.如果数据有效并且是预期的,则使用 clientscriptmanager.registerforeventvalidation 方法来注册回发或回调数据以进行验证. 解决办法: 如果页面

典型的DIV+CSS三行二列居中高度自适应布局

css|自适应 如何使整个页面内容居中,如何使高度适应内容自动伸缩.这是学习CSS布局最常见的问题.下面就给出一个实际的例子,并详细解释.(本文的经验和是蓝色理想论坛xpoint.guoshuang共同讨论得出的.) 首先先按这里看实际运行效果,这个页面在mozilla.opera和IE浏览器中均可以实现居中和高度自适应.我们来分析代码: CSS: body{background:#999;text-align:center;color: #333;font-family:arial,verda

div ul li 嵌套后如何解决增加多个li后DIV高度自适应问题

div ul li 嵌套的使用在网页布局中很常见,最主要的问题就是如何解决增加多个li后DIV高度自动适应问题,本文有个不错的示例,可以解决此问题,大家可以尝试运行下     复制代码 代码如下: <body bgcolor="#0B3D82"> div ul li 嵌套后解决高度自适应办法: html代码如下 复制代码 代码如下: <div class="main_div"> <ul> <li><a href=

div高度自适应方法总结

看下面代码:    代码如下 复制代码 <style type="text/css">     .mytest     {         width:100px;         height:100px;         border:1px solid green;     } </style>     <div class="mytest">据英国<每日电讯报>11月30日报道,以色列安全内阁当天批准在约旦河西

overflow解决float浮动后高度自适应问题

也许你在做网页的时候发现,发一个区块内的元素被应用了float之后,那么整个box的高度对就不以被浮动对象的高度为标准了. 如图中的城市导航内的城市列表中采用了float之后,那个外框的高度并不是内容元素的高度: 怎么解决这个问题呢?经发现可以采用overflow来解决!方法是在父元素加上如下代码即可 overflow:auto; zoom:1; overflow:auto;是让高度自适应, zoom:1;是为了兼容IE6,也可以用height:1%;的方式来解决. <!DOCTYPE html