大div套多个小div,怎样设置外div的高度自适应?
在最后一个div 后面加上 overflow:hidden;如下:
<div style="width:580px; height:auto; margin:0 auto;
<div style="height:100px; width:230px; float:left; margin:20px"></div>
<div style="height:100px; width:230px; float:left; margin:20px"></div>
<div style="height:100px; width:230px; float:left; margin:20px"></div>
<div style="clear:both;height:1px;width:100%; overflow:hidden; margin-top:-1px;"></div>
</div>
亲自验证。
大div套多个小div,怎样设置外div的高度自适应?的更多相关文章
- Position a child div relative to parent container in CSS: [设置 子DIV位置 跟 父DIV相关联]
最近调DIV的位置比较头疼,各种position: relative / absolute google到一篇好文章[http://www.webdevdoor.com/html-css/css-po ...
- css+div 布局遇到的小常识
/根目录../上层目录举例如下: 在photo.css文件中写入: div.ls{ background:url(../photo/framels.jpg) no-repeat left; }div. ...
- CSS: 解决Div float后,父Div无法高度自适应的问题
在用CSS+DIV的布局中,常常会发现,当一个DIV float之后,假设他的高度超过了其父DIV的高度时,其父DIV的高度并不会对应的进行调整.要解决问题(也叫做闭合(清除)浮动),我们有四种办法: ...
- DIV高度自适应及注意问题(转)
本文和大家重点讨论一下DIV高度自适应及注意问题,主要包括父div高度随子div的高度改变而改变和子div高度随父亲div高度改变而改变两种情况. DIV高度自适应及注意问题 积累了一些经验,总结出一 ...
- div中iframe高度自适应问题
网页分为上.中.下三部分,上.下高度固定中间高度自适应:中间分为左.右两部分,左边宽度固定,右边宽度自适应.现在右侧div是宽度和高度都是自适应,右侧div里有个IFrame,想让IFrame自适应外 ...
- easyUI draggable插件使用不当,导致拖动div内部文本框无法输入;设置echarts数据为空时就显示空白,不要动画和文字
先上一个Demo <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://ww ...
- div高度自适应
第一种: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3 ...
- div高度自适应填充剩余部分
在乐学一百的开发过程中,遇到了一个小乐Fm开发,需要跟百度fm差不多,上边一个条,下边一个条,中间部分填充.但是还不能固定高度,因为屏幕的宽高都不一样...height:100%是不可行的.搜了一圈, ...
- 典型的DIV CSS三行二列居中高度自适应布局
如何使整个页面内容居中,如何使高度适应内容自动伸缩.这是学习CSS布局最常见的问题.下面就给出一个实际的例子,并详细解释.(本文的经验和是蓝色理想论坛xpoint.guoshuang共同讨论得出的.) ...
随机推荐
- css 三角形空心三角形的简单实现
<style> #talkbubble { width: 120px; height: 80px; position: relative; -moz-border-radius: 10px ...
- robotframe添加自定义lib 报Importing test library ‘xxxx’ failed
问题现象:在linux服务器上搭建jenkins 执行robot工程时报:Importing test library ‘xxxx’ failed 问题分析一: 在library 引入非rob ...
- php的微信公众平台开发接口类
<?php define("TOKEN", "weixin"); $wechatObj = new wechatCallbackapiTest(); if ...
- 总结一下NDK crash排查步骤
总结一下NDK crash排查步骤: 先在PC上跑通算法 用Visual Studio写算法的testbed,确保算法能跑通 抓log adb logcat -c; adb logcat > 1 ...
- Linux CentOs下安装lnmp
1.下载源码包 以root目录为例: cd ~ # 下载安装包 wget http://nginx.org/download/nginx-1.17.2.tar.gz # nginx wget http ...
- OpenStack核心组件-cinder存储服务
1. cinder 介绍 Block Storage 操作系统获得存储空间的方式一般有两种: 1) 通过某种协议(SAS,SCSI,SAN,iSCSI 等)挂接裸硬盘,然后分区.格式化.创建文 ...
- 编译heartbeat出现的问题
如报 cc1: warnings being treated as errors pils.c:245: error: initialization fromincompatible pointer ...
- Kotlin协程作用域与Job详解
Job详解: 在上一次https://www.cnblogs.com/webor2006/p/11725866.html中抛出了一个问题: 所以咱们将delay去掉,需要改造一下,先把主线程的dela ...
- collections.defaultdict()
https://www.cnblogs.com/herbert/archive/2013/01/09/2852843.html >>> import collections > ...
- learning scala list.collect
collect will apply a partial function to all elements of a Traversable and return a different collec ...