1、问题截图:

2、问题描述:

由于地址、公司名长度的不定性,所以每一条地址所在的父级div高度不定,但是需要设置一个最小的高度min-height:48px;但是当内容增加的时候,父级div高度却不能自适应

3、HTML代码:

<div class="right-info3">
<div class="address_info">
<li class="company">深圳华东纱线纺织有限公司</li>
<li class="master">李启东</li>
<li class="address">深圳市南山区华龙大道65号</li>
<li class="code">500021</li>
<li class="phone">139****8888</li>
<li class="operate"><a class="revise" href="#nowhere">修改</a> | <a class="delete" href="#nowhere">删除</a></li>
</div>
<div class="address_info">
<li class="company">深圳东风华东纱线纺织有限公司</li>
<li class="master">李启东</li>
<li class="address">深圳市南山区华龙大道101号A3栋21楼102室深圳市南山区华龙大道101号A3栋21楼102室</li>
<li class="code">500021</li>
<li class="phone">139****8888</li>
<li class="operate"><a class="revise" href="#nowhere">修改</a> | <a class="delete" href="#nowhere">删除</a></li>
</div>
</div>

4、CSS代码:

.right-info3{
width: 960px;
margin-left: 10px;
margin-top: 10px;
list-style: none;
font-family: "微软雅黑";
font-size: 16px;
color: #333333;
} .address_info{
width: 960px;
min-height: 48px;
background-color: #F7FCFF;
border: 1px solid #e8e8e8;
margin-top: 10px;
} .address_info li{
float: left; //因为此处设置了float所以导致了父级div高度不能自适应
margin-top: 13px;
margin-bottom: 13px;
} .company{
width: 200px;
margin: 0 15px;
} .master{
width: 80px;
margin: 0 15px;
} .address{
width: 240px;
margin: 0 10px;
} .code{
width: 90px;
margin: 0 10px 0 20px;
} .phone{
width: 114px;
margin: 0 15px 0 10px;
} .revise{
color: #38adff;
} .delete{
color: #333333;
}

5、解决办法:

在父级标签div闭合之前,即父级的</div>之前,加上以下代码,用于清除浮动对象

<div class="clear"></div>

然后给clear添加以下样式

.clear{
clear: both;
}

6、解决后效果图:

div高度不能自适应(子级使用float浮动,父级div高度不能自适应)的更多相关文章

  1. <转载>如何解决子级用float浮动父级div高度不能自适应的问题

    转载:http://www.kwstu.com/ArticleView/divcss_2013101582430202 解决子级对象使用css float浮动 而父级div不能自适应高度,不能被父级内 ...

  2. 解决子级用css float浮动 而父级div没高度不能自适应高度

    解决子级对象使用css float浮动 而父级div不能自适应高度,不能被父级内容撑开解决方法,父级div没有高度解决方法. 最外层的父级DIV不能自适应高度-不能随对象撑开没有高度 当在对象内的盒子 ...

  3. CSS| 解决子级用css float浮动 而父级div没高度不能自适应高度

    解决子级用css float浮动 而父级div没高度不能自适应高度 解决子级对象使用css float浮动 而父级div不能自适应高度,不能被父级内容撑开解决方法,父级div没有高度解决方法. 最外层 ...

  4. 子级用css float浮动 而父级div没高度不能自适应高度

    子级对象使用css float浮动 而父级div不能自适应高度. 对父级div标签闭合</div>前加一个clear清除浮动对象. <!DOCTYPE html> <ht ...

  5. 让一个父级div根据子级div高度而自适应高度

    需求是点击上传的时候进行子级div高度不定,相对来说父级div高度也不能固定,把元素都设置成普通标准流,然后样式可以使用margin内边距或者padding外边距来进行调节 放上代码供参考: .opu ...

  6. float浮动问题:会造成父级元素高度坍塌;

    float浮动问题:会造成父级元素高度坍塌: 解决办法:清除浮动:clear:both; 给父元素高度:height(不是很可取) 给父元素:display:inline-black:(问题:marg ...

  7. 利用CSS背景颜色属性使父级div背景透明同时避免子级标签透明。

    实现背景色透明效果的代码 实现各个浏览器中具备良好的透明特性的效果,IE中使用私有滤镜filter,高端浏览器使用CSS3中的rgba属性. 输入十六进制的颜色值以及透明度,自动在IE的过渡滤镜以及C ...

  8. 子级div相对于父级div位置不变

    设置父级div为相对位置 设置子级div为绝对位置 代码如下: <!DOCTYPE html> <html> <head> <meta charset=&qu ...

  9. js变量在属性里的写法 常用mark 多个DL遍历添加一个父级DIV

    标记用 js变量比如url链接一般都是a里面的href属性值 在js里单引号链接 以后再忘记就能有地方找了 例子: /* 添加1200 居中div 包裹 获取元素集合 上层元素100% * @ele ...

随机推荐

  1. VC代码生成里面的/MT /MTd /MD /MDd的意思

    VC代码生成里面的/MT /MTd /MD /MDd的意思. 意思上已经很明白了.但是往往很多人弄不清楚到底怎么选择. /MT是 "multithread, static version ” ...

  2. mui 关闭当前窗口

    在提交表单的时候,我们都需要关闭表单.需要关闭当前打开的窗口. bit.alert('提交成功' + (result.category.needAudit ? ",请耐心等待管理员审核信息后 ...

  3. 洛谷P2854 [USACO06DEC]牛的过山车Cow Roller Coaster

    P2854 [USACO06DEC]牛的过山车Cow Roller Coaster 题目描述 The cows are building a roller coaster! They want you ...

  4. 剑指Offer的学习笔记(C#篇)-- 合并两个排序的链表

    题目描述 输入两个单调递增的链表,输出两个链表合成后的链表,当然我们需要合成后的链表满足单调不减规则. 一 . 题目分析 根据题意,可得出,该题目要求两个单增的链表合成一条单增的链表. 链表一:1→5 ...

  5. Oracle树查询总结

    最近在做公司的项目中遇到一个问题,多级级联导航菜单,虽然只有三级目录,但<li>中嵌套<ul>,数据库表结构如下: CREATE TABLE FLFL ( ID NUMBER ...

  6. spingmvc实现在程序启动时调用数据库数据

    直接上代码: package com.java.zxf.servlet; import java.text.ParseException; import java.text.SimpleDateFor ...

  7. JQuery序列化表单serialize() 以及 serializeArray()

    都是利用form表单传递数据的 1.serialize()方法 描述:序列化表单内容为字符串,用于Ajax请求. 数据类似于这种: FirstName=Bill&LastName=Gates  ...

  8. CodeForces - 1003-B-Binary String Constructing (规律+模拟)

    You are given three integers aa, bb and xx. Your task is to construct a binary string ssof length n= ...

  9. 随机算法瞎练BZOJ3237&3563&3569三倍经验题

    随机方法真的好骚啊O(∩_∩)O~ 最早的时候miaom提出一个奇怪的东西: 判断一个数列中是否有0/1/2个数出现奇数次 对每个数赋一个随机权值,异或乱搞,对于判2的情况用一个(可能类似线性基的)方 ...

  10. 解决git从remote clone后所有文件都改变的问题

    遇到2次这种情况了,git从remote clone项目代码后发现所有文件都要改变,因为权限改变了,可以通过git来设置忽略权限变化 git config --global core.fileMode ...