css实现div的高度随着另一个div的高度改变

有如下代码

</div>

怎样让left的高度随着right高度的变化来改变自身高度，第一种办法可以使用js来进行控制

但这里要介绍的是使用css,这里有一个简单的方法

给父元素parent设置相对定位，然后给left设置绝对定准，并且left不要高度，top值和bottom值为别为0;

parent也不要高度，它的高度是由子元素right撑开，这样就可以实现left的高度随着right的改变而变化了。

.parnet{width: 1000px;margin: 30px auto 30px;overflow: hidden;position: relative;
}
.left{width: 200px;background: #FFF;border: 1px solid #d3d3d3;border-radius: 3px;display: inline-block;position: absolute;top: 0;bottom: 0;
}
.right{width: 760px;min-height: 680px;background: #FFF;border: 1px solid #d3d3d3;border-radius: 3px;
}

/*当然了实现的方式肯定不止这一种，还有其它的办法，欢迎下方留言提出，谢谢*/

css实现div的高度随着另一个div的高度改变相关推荐

将div垂直居中放置在另一个div中[重复]
本文翻译自:Vertically centering a div inside another div [duplicate] This question already has answers he ...
html div显示页面中间,使一个div始终显示在页面中间
使一个div始终显示在页面中间假设我们有一个div层: 首先,我们用css来控制它在水平上始终居中,那么我们的css代码应该是这样: *{margin:0;padding:0;} #myDiv{wi ...
div设置float后下一个div要换行的解决办法
div设置float之后,如果没有清除,则下一个被设置float的div会根据上一个float的div的布局进行排版:而下一个没设置float属性的div则是根据它的前一个元素进行排版. 要清除flo ...
html是div环绕文字,文字环绕一个div在HTML
看到,因为我不能用"浮动",在我的标题"绝对",文字环绕一个div在HTML 我有几个div的嵌套我DIV,其中有些是浮动的范围内,并绝对定位的图像占位符.浮动 ...
vue中 div高度随另一个div的高度变化
最近做了好几个项目,终于把手里的事情干完了,趁着这几天比较空整理一下最近遇到的一些问题以及解决方案. 问题描述: in-wrap的高度不固定,会随着内容的多少改变,而out-wrap的高度则需要跟随i ...
flex布局实现叠在另一个div之上_如何让一个div在另一个div的上面，求高手指点...
展开全部方法: 这个用绝对定位就可以搞定了.32313133353236313431303231363533e59b9ee7ad9431333365663466 position:absolute; ...
一个完美的导航条html,一个DIV CSS代码布局的简单导航条
简单的DIV CSS代码布局实现导航条一个蓝色主题的导航条布局案例,本CSS小实例,采用DIV CSS实现.同时不用图片做背景,直接使用背景色实现,鼠标经过悬停对应栏目名称是对应背景蓝色变深. 导航 ...
HTML下拉菜单为什么无线拉长,【CSS】怎么拉长一个div的高度
请看技巧与提示的那里,由于文字不是很多,导致在大屏幕上,这个div太短了,现在页面有点难看,但是在比较小的屏幕(笔记本屏幕),效果还是可以的,这个该怎么决解呢? 我希望的效果如下回答: $(&quo ...
html div左中右布局,求助css。一个div包含两个div，左右布局，左边css宽30%，右边div宽70%。高度均自...
求助css. 一个div包含两个div,左右布局,左边css宽30%,右边div宽70%.高度均自以下文字资料是由(历史新知网www.lishixinzhi.com)小编为大家搜集整理后发布的内容,让 ...

css实现div的高度随着另一个div的高度改变

css实现div的高度随着另一个div的高度改变相关推荐

最新文章

热门文章