Hello! There is such a repeating fragment of html code:
<div class="row"> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="clear"></div> </div>
This structure can be presented in two versions - a table and rows, the corresponding switch is already implemented.
You need to align the item height only for the "table" view, when they are presented as columns and reset to auto when switching to the "row" mode, so that each item has its own height (otherwise there will be extra padding between the lines).
Those. each div with the item class must be set to the maximum of their heights in the current row block.
It is desirable through jQuery ... But any options are welcome!
I tried this:
$('.item').height( $('.item').parent().children().filter('.item').height() + 'px' );
But this is how the height is set only for the first item , and its own, i.e. nothing changes.