Div即父容器不根据内容自适应高度的解决方法
发布时间:2010-04-23 18:19:00
ps:不曾想还有那么好用的方法。汗一个先。
Div即父容器不根据内容自适应高度,我们看下面的代码:
<div id="main">
<div id="content"></div>
</div>
当Content内容多时,即使main设置了高度100%或auto。在不同浏览器下还是不能完好的自动伸展。内容的高度比较高了,但容器main的高度还是不能撑开。
我们可以通过三种方法来解决这个问题。
一,增加一个清除浮动,让父容器知道高度。请注意,清除浮动的容器中有一个空格。
<div id="main">
<div id="content"></div>
<div style="font: 0px/0px sans-serif;clear: both;display: block"> </div>
</div>
二,增加一个容器,在代码中存在,但在视觉中不可见。
<div id="main">
<div id="content"></div>
<div style="height:1px; margin-top:-1px;clear: both;overflow:hidden;"></div>
</div>
三,增加一个BR并设置样式为clear:both。
<div id="main">
<div id="content"></div>
<br style="clear:both;" />
</div>
补充:
<div id="main">
<div id="content">
<p>demo1</p>
<p>demo2</p>
<p>demo3</p>
</div>
</div>
#main { border:1px solid #999999; background-color:#CCCCCC; height:100%; overflow:hidden;}
#content { float:left;}
以上三个方法都不是最好的解决方法,因为在程序代码观念中是提倡尽量不要添加无意义的标签代码
介绍我的解决方法是直接在最外层div加以下样式
#main {
height:100%;
overflow:hidden;
}
猜你喜欢
- python提供了4种方式来满足进程间的数据通信1. 使用multiprocessing.Queue可以在进程间通信,但不能在Pool池创建
- mysql安装目录使用MySQL AB's Linux RPM分发进行安装后,将在以下系统目录产生文件目录目录内容/usr/bin客
- 引言 亚马逊网站相较于国内的购物网站,可以直接使用python的最基本的request
- 开启Web服务1.基本方式Python中自带了简单的服务器程序,能较容易地打开服务。在python3中将原来的SimpleHTTPServe
- 0.环境需要1.准备Linux环境(系统:CentOS7)2.准备MySQL安装包(版本:8.0.20)3.安装方式为:msyql解压安装1
- 1.优化应用程序和业务逻辑,这个是最重要的。 2.数据库设计阶段范式和反范式的灵活应用。一般情况下,对于频繁访问但是不频繁修改的数据,内部设
- 本文实例讲述了Python实现的端口扫描功能。分享给大家供大家参考,具体如下:一 代码import sysimport socketimpo
- 主键索引排序失效环境:MySQL8有一张用户信息表user_info,建表DDL如下:CREATE TABLE `user_info` (
- 本文实例讲述了Python使用tkinter库实现文本显示用户输入功能。分享给大家供大家参考,具体如下:#coding:utf-8from
- 一、什么是数组数组就是一组数据的集合,把一系列数据组织起来,形成一个可操作的整体。数组的每个实体都包含两项:键和值。二、声明数据在PHP中声
- classList属性的方法:add();remove();toggle();描述,在一些页面我们需要使用两个按钮来回切换,如图:我们要使用
- 需求背景公司前端使用 Highcharts 构建图表,图表的图例支持点击显示或隐藏相应的指标。现在有需求后端需要存储用户在前端点击后显示图表
- File->Setting找到Appearance & Behavior -->System Setting,在右边窗口
- 语法print('\033[显示方式;字体色;背景色m文本\033[0m')# 三种设置都可以忽略不写,都不写则为默认输出配
- 使用Resample函数转换时间序列 一、什么是resample函数?它是Python数据分析库Pandas的方法函数。它主要用于
- 将VS2017上配置OpenCV4.1.0的过程记录于此。准备工具:OpenCV:4.1.0IDE:VS2017安装环境:Win10 &nb
- 网页的圆角处理,其实最开始的九宫格的表格处理是挺方便的,只是现在都不用表格布局了,自然就被非法取缔了。呵呵。微软的有VML画圆角,由于只是它
- 本文为大家分享了Eclipse开发python脚本的具体方法,供大家参考,具体内容如下一、安装python1.访问网址,可以看到如下图所示界
- 前言Tree一直是大家熟知的组件,做一些大型的后台管理系统都会用到。使用树组件可以完整的展现其中的层级关系,并具有展开收起选择等交互功能。效
- 这两天在用python的bottle框架开发后台管理系统,接口约定使用RESTful风格请求,前端使用jquery ajax与接口进行交互,