1

I want to keep same height across children elements.

Here is an example:

  • I have 3 rows
  • Each row contains 3 cells
  • Each cell contains 2 items (one in red / one in blue)

The red item on each first cell contains long text, and I would like the other red items on the others cells (cell n°2 and n°3) to have the same height.

What I have

![![enter image description here

What I want

![![enter image description here

2nd example

What I have:

enter image description here

What I want:

enter image description here

Simon Bruneaud
  • 1,917
  • 1
  • 10
  • 20
  • what would you expect to happen if the purple had some long text too? - it's quite easy to achieve the above if you don't need to worry about the purple size. Also your pen seems to have solved your problem – Pete Oct 27 '20 at 14:11
  • Please don't post your code to 3rd party sites and link to them from your question as links can die over time. Just post your code right along with your question. – Scott Marcus Oct 27 '20 at 14:15
  • @ScottMarcus yes I know, will remove codesandbox once resolved and post real code. It's just way faster to manipulate and understand html/css using codesandbox and images – Simon Bruneaud Oct 27 '20 at 14:49
  • *It's just way faster to manipulate and understand html/css using codesandbox and images* – Scott Marcus Oct 27 '20 at 15:00

1 Answers1

0

if you want to use just css, you should give all of your red divs a fixed height, like:

.redDivs{
   height:35px;
}

and if you want to use JS, try this link:

HamiD
  • 786
  • 4
  • 19