设置DIV高度等于另一个DIV高度
[英]Set a DIV height equal with of another DIV height
问题描述
I have two DIVs, .prev and .SLDR-ONE and I want to set .prev to keep the same height with .SLDR-ONE . 
我有两个DIV， .prev和.SLDR-ONE ，我想将.prev设置为与.SLDR-ONE保持相同的高度。
I've tried the following: 我尝试了以下方法：
$(".prev").css({'height':($(".SLDR-ONE").height()+'px')});
It is not working properly because .SLDR-ONE doesn't have defined height. 由于.SLDR-ONE没有定义的高度，因此无法正常工作。 .prev take the height of the page except if I define a height to .SLDR-ONE (ex:300px). .prev取页面的高度，除非我将.SLDR-ONE的高度定义为（例如：300px）。
.SLDR-ONE has css : float:left; position:relative .SLDR-ONE具有css： float:left; position:relative float:left; position:relative , so the height is defined automaticaly. float:left; position:relative ，因此高度是自动定义的。
3 个解决方案
解决方案1
2 已采纳 2017-02-08 19:20:27
尝试使用innerHeight来获取.prev的高度。
解决方案2
0 2017-02-08 19:33:29
As from .height() method of jQuery returns width of the element excluding padding ,margin and bottom.So if you want same height for both of the div 从jQuery的.height（）方法开始，返回元素的宽度（不包括padding，margin和bottom）。因此，如果您希望两个div的高度相同
- You should be using outerHeight(). 您应该使用outerHeight（）。 And there are possibility that you have assigned the same class to some other element and the method may be returning value of width and height of that element. 并且可能您已将同一类分配给其他元素，并且该方法可能返回该元素的width和height值。
解决方案3
0 2017-02-08 21:25:28
You could do this using offsetHeight 您可以使用offsetHeight
(function(){ var one = document.querySelector('.one'); var two = document.querySelector('.two') two.style.height = one.offsetHeight + 'px'; }())
.one{ float: left; position: relative; } .two{ background: #ccc; clear: both; }
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>JS Bin</title> </head> <body> <div class="one"> <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing </p> </div> <div class="two"> </div> </body> </html>
If you prefer jQuery then you could use innerHeight . 如果您更喜欢jQuery，则可以使用innerHeight 。 innerHeight documentation. innerHeight文档。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.