ボックスの高さを一番高いものに合わせる

Ads

Result

jQuery

var maxHeight = 0;
//もしdivがmaxHeightの値より大きい場合はdivの高さを全部合わせる
$("div").each(function(){
   if ($(this).height() > maxHeight) { maxHeight = $(this).height(); }
});
//divの高さを取得する
$("div").height(maxHeight);

css

div{
    height:auto;
    width: 70px ;
    background:#eee;
    margin:3px;
    float:left;
}

html

<div>1<br />2<br />3<br />4<br />5</div>

<div>div</div>

<div>div</div>

<div>div</div>

<div></div>

<div>1<br />2<br />3<br />4<br />5<br />6<br />7<br />8<br />9</div>

<div></div>

via

Equalize Heights of Divs | CSS-Tricks


Warning: include(/home/youhei0828/kachibito.net/public_html/wp-content/themes/cocoon-master/my-php/jquery-other-snippets.php): Failed to open stream: No such file or directory in /home/youhei0828/kachibito.net/public_html/wp-content/themes/kachibito7_with_cocoon_child/functions-module/shortcode/add-post-myphp.php on line 7

Warning: include(): Failed opening '/home/youhei0828/kachibito.net/public_html/wp-content/themes/cocoon-master/my-php/jquery-other-snippets.php' for inclusion (include_path='.:/opt/php-8.1.29/data/pear') in /home/youhei0828/kachibito.net/public_html/wp-content/themes/kachibito7_with_cocoon_child/functions-module/shortcode/add-post-myphp.php on line 7