Becky
Becky

Reputation: 5585

Set multiple div height based on a defined div

How do I make <div A> and <div C> to have same height as <div B> in javascript/jquery?

<div id="wrapper">
  <div id="divA"></div>
  <div id="divB"></div>
  <div id="divC"></div>
</div>

<script>
 $('#divA').css('height', $('#divB').innerHeight());
 $('#divC').css('height', $('#divB').innerHeight());
</script>

enter code here

Upvotes: 1

Views: 102

Answers (2)

stanze
stanze

Reputation: 2480

Try this demo : fiddle

var selDivB = $('#divB').height();
$('#divA, #divC').height(selDivB);

Upvotes: 0

guest271314
guest271314

Reputation: 1

Try

$("#divA, #divC").height($("#divB").height());

$("#divA, #divC").height($("#divB").height());
#divA, #divC {
  height: 50px;
  width:50px;
  background:gold;
}

#divB {
  height: 100px;
  width:50px;
  background:red;
}

div {
  display:inline-block;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<div id="wrapper">
  <div id="divA"></div>
  <div id="divB"></div>
  <div id="divC"></div>
</div>

Upvotes: 5

Related Questions