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
  • 2,263
  • 2
  • 12
  • 24
  • 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* <-- **No, it's not.** We have to leave Stack Overflow and go to a 3rd party site. You assume that we know how to navigate that site and find all the parts of your code that we need to see. Instead, you could have just posted your code right here in a Stack Snippet and we'd be able to run it here and see it all right here. – 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
  • 1,075
  • 1
  • 6
  • 22