我想将一个 div 的高度推到等于其他 div 的高度。 在我的例子中，我有 2 个 div:div one 和 div two。我需要将 div 2 的高度推到等于 div 1。无论 div 2 上的内容如何，高度都将等于 div one。如果 div two 上的内容比 div one 上的内容长，它将溢出 div two。就像下面描述的那样:
是否可以使用 jquery、CSS 或它们的组合？ 我在这里尝试其他问题的一些答案，但大多数情况不同。这里的大多数问题是关于 2 个 div 之间的相等，而不是等于一个 div。
感谢您提供的任何帮助。
最佳答案
只有CSS
<html>
<head></head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<style>
.mydiv
{
width: 200px;
height: 300px;
overflow: scroll;
border:2px solid black;
text-align: center;
position: absolute;
}
#one{
left: 10px;
}
#two{
left:220px;
}
</style>
<body>
<div class="mydiv" id="one">kjfkdfjdkfjkfjdkfjk jfkdjfdkfj kdfj kjfkfj kdjfkdfjdkfjdkfjdkfjdkfjkdfjdkfjdkfja ldjfdk jdkf jdkfjdk jfkdjfdk jkdjfkdjfkdjfkdjfkdfjdkfj kdjkdjfkdjfkdfjdkfjdkfjdkfjdkfjkdfjk
</div>
<div class="mydiv" id="two">
kdlfjdlfa;fj jfaljfkdlfjd jjf ljfal jljfafj dj djajfafajfdljadflkdjfldfjlfjdfjdkfjdslfjdlkfjdfkdjfdkfjdkfjdkfjdkfjdkfjdkjfkdjfkjfkjfkdjfkdfjkfjdkjfkdjfkdfjkdlfjdlfa;fj jfaljfkdlfjd jjf ljfal jljfafj dj djajfafajfdljadflkdjfldfjlfjdfjdkfjdslfjdlkfjdfkdjfdkfjdkfjdkfjdkfjdkfjdkjfkdjfkjfkjfkdjfkdfjkfjdkjfkdjfkdfjkdlfjdlfa;fj jfaljfkdlfjd jjf ljfal jljfafj dj djajfafajfdljadflkdjfldfjlfjdfjdkfjdslfjdlkfjdfkdjfdkfjdkfjdkfjdkfjdkfjdkjfkdjfkjfkjfkdjfkdfjkfjdkjfkdjfkdfjkdlfjdlfa;fj jfaljfkdlfjd jjf ljfal jljfafj dj djajfafajfdljadflkdjfldfjlfjdfjdkfjdslfjdlkfjdfkdjfdkfjdkfjdkfjdkfjdkfjdkjfkdjfkjfkjfkdjfkdfjkfjdkjfkdjfkdfjkdlfjdlfa;fj jfaljfkdlfjd jjf ljfal jljfafj dj djajfafajfdljadflkdjfldfjlfjdfjdkfjdslfjdlkfjdfkdjfdkfjdkfjdkfjdkfjdkfjdkjfkdjfkjfkjfkdjfkdfjkfjdkjfkdjfkdfjkdlfjdlfa;fj jfaljfkdlfjd jjf ljfal jljfafj dj djajfafajfdljadflkdjfldfjlfjdfjdkfjdslfjdlkfjdfkdjfdkfjdkfjdkfjdkfjdkfjdkjfkdjfkjfkjfkdjfkdfjkfjdkjfkdjfkdfjkdlfjdlfa;fj jfaljfkdlfjd jjf ljfal jljfafj dj djajfafajfdljadflkdjfldfjlfjdfjdkfjdslfjdlkfjdfkdjfdkfjdkfjdkfjdkfjdkfjdkjfkdjfkjfkjfkdjfkdfjkfjdkjfkdjfkdfjkdlfjdlfa;fj jfaljfkdlfjd jjf ljfal jljfafj dj djajfafajfdljadflkdjfldfjlfjdfjdkfjdslfjdlkfjdfkdjfdkfjdkfjdkfjdkfjdkfjdkjfkdjfkjfkjfkdjfkdfjkfjdkjfkdjfkdfjkdlfjdlfa;fj jfaljfkdlfjd jjf ljfal jljfafj dj djajfafajfdljadflkdjfldfjlfjdfjdkfjdslfjdlkfjdfkdjfdkfjdkfjdkfjdkfjdkfjdkjfkdjfkjfkjfkdjfkdfjkfjdkjfkdjfkdfjkdlfjdlfa;fj jfaljfkdlfjd jjf ljfal jljfafj dj djajfafajfdljadflkdjfldfjlfjdfjdkfjdslfjdlkfjdfkdjfdkfjdkfjdkfjdkfjdkfjdkjfkdjfkjfkjfkdjfkdfjkfjdkjfkdjfkdfjkdlfjdlfa;fj jfaljfkdlfjd jjf ljfal jljfafj dj djajfafajfdljadflkdjfldfjlfjdfjdkfjdslfjdlkfjdfkdjfdkfjdkfjdkfjdkfjdkfjdkjfkdjfkjfkjfkdjfkdfjkfjdkjfkdjfkdfjkdlfjdlfa;fj jfaljfkdlfjd jjf ljfal jljfafj dj djajfafajfdljadflkdjfldfjlfjdfjdkfjdslfjdlkfjdfkdjfdkfjdkfjdkfjdkfjdkfjdkjfkdjfkjfkjfkdjfkdfjkfjdkjfkdjfkdfj
</div>
<script type="text/javascript">
</script>
</body>
</html>或使用 jquery
<html>
<head></head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<style>
.mydiv{
overflow: scroll;
border:2px solid black;
text-align: center;
position: absolute;
}
#one{
width: 200px;
height: 300px;
}
#two{
left:220px;
}
</style>
<body>
<div class="mydiv" id="one">kjfkdfjdkfjkfjdkfjk jfkdjfdkfj kdfj kjfkfj kdjfkdfjdkfjdkfjdkfjdkfjkdfjdkfjdkfja ldjfdk jdkf jdkfjdk jfkdjfdk jkdjfkdjfkdjfkdjfkdfjdkfj kdjkdjfkdjfkdfjdkfjdkfjdkfjdkfjkdfjk
</div>
<div class="mydiv" id="two">
kdlfjdlfa;fj jfaljfkdlfjd jjf ljfal jljfafj dj djajfafajfdljadflkdjfldfjlfjdfjdkfjdslfjdlkfjdfkdjfdkfjdkfjdkfjdkfjdkfjdkjfkdjfkjfkjfkdjfkdfjkfjdkjfkdjfkdfjkdlfjdlfa;fj jfaljfkdlfjd jjf ljfal jljfafj dj djajfafajfdljadflkdjfldfjlfjdfjdkfjdslfjdlkfjdfkdjfdkfjdkfjdkfjdkfjdkfjdkjfkdjfkjfkjfkdjfkdfjkfjdkjfkdjfkdfjkdlfjdlfa;fj jfaljfkdlfjd jjf ljfal jljfafj dj djajfafajfdljadflkdjfldfjlfjdfjdkfjdslfjdlkfjdfkdjfdkfjdkfjdkfjdkfjdkfjdkjfkdjfkjfkjfkdjfkdfjkfjdkjfkdjfkdfjkdlfjdlfa;fj jfaljfkdlfjd jjf ljfal jljfafj dj djajfafajfdljadflkdjfldfjlfjdfjdkfjdslfjdlkfjdfkdjfdkfjdkfjdkfjdkfjdkfjdkjfkdjfkjfkjfkdjfkdfjkfjdkjfkdjfkdfjkdlfjdlfa;fj jfaljfkdlfjd jjf ljfal jljfafj dj djajfafajfdljadflkdjfldfjlfjdfjdkfjdslfjdlkfjdfkdjfdkfjdkfjdkfjdkfjdkfjdkjfkdjfkjfkjfkdjfkdfjkfjdkjfkdjfkdfjkdlfjdlfa;fj jfaljfkdlfjd jjf ljfal jljfafj dj djajfafajfdljadflkdjfldfjlfjdfjdkfjdslfjdlkfjdfkdjfdkfjdkfjdkfjdkfjdkfjdkjfkdjfkjfkjfkdjfkdfjkfjdkjfkdjfkdfjkdlfjdlfa;fj jfaljfkdlfjd jjf ljfal jljfafj dj djajfafajfdljadflkdjfldfjlfjdfjdkfjdslfjdlkfjdfkdjfdkfjdkfjdkfjdkfjdkfjdkjfkdjfkjfkjfkdjfkdfjkfjdkjfkdjfkdfjkdlfjdlfa;fj jfaljfkdlfjd jjf ljfal jljfafj dj djajfafajfdljadflkdjfldfjlfjdfjdkfjdslfjdlkfjdfkdjfdkfjdkfjdkfjdkfjdkfjdkjfkdjfkjfkjfkdjfkdfjkfjdkjfkdjfkdfjkdlfjdlfa;fj jfaljfkdlfjd jjf ljfal jljfafj dj djajfafajfdljadflkdjfldfjlfjdfjdkfjdslfjdlkfjdfkdjfdkfjdkfjdkfjdkfjdkfjdkjfkdjfkjfkjfkdjfkdfjkfjdkjfkdjfkdfjkdlfjdlfa;fj jfaljfkdlfjd jjf ljfal jljfafj dj djajfafajfdljadflkdjfldfjlfjdfjdkfjdslfjdlkfjdfkdjfdkfjdkfjdkfjdkfjdkfjdkjfkdjfkjfkjfkdjfkdfjkfjdkjfkdjfkdfjkdlfjdlfa;fj jfaljfkdlfjd jjf ljfal jljfafj dj djajfafajfdljadflkdjfldfjlfjdfjdkfjdslfjdlkfjdfkdjfdkfjdkfjdkfjdkfjdkfjdkjfkdjfkjfkjfkdjfkdfjkfjdkjfkdjfkdfjkdlfjdlfa;fj jfaljfkdlfjd jjf ljfal jljfafj dj djajfafajfdljadflkdjfldfjlfjdfjdkfjdslfjdlkfjdfkdjfdkfjdkfjdkfjdkfjdkfjdkjfkdjfkjfkjfkdjfkdfjkfjdkjfkdjfkdfj
</div>
<script type="text/javascript">
var div_one_width = $("#one").width(); //get the first div width
var div_one_height = $("#one").height(); // get the second div height.
$("#two").css({"width":div_one_width+'px',"height":div_one_height+'px'})
</script>
</body>
</html>关于javascript - 如何使一个div与一个div具有相同的高度，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39549159/