jQuery height getting inaccurate height [closed]

So I am trying to get the height of certain elements and the first two heights are perfect but for some reason the third height outputs 264.844px when it should be 253px now the weird thing is once the page loads and I run the same script in the console it gives the correct height so I am not sure why its off originally?

            var featured_article_height_home = jQuery('.home .featured-article.one').height();
            $("#ESG_Partner_Content_1").css('height', featured_article_height_home);

            var featured_article_height_home_two = jQuery('.home .featured-article.two').height();
            $("#ESG_Partner_Content_4").css('height', featured_article_height_home_two);

            var featured_article_height_home_three = jQuery('.home .featured-article.three').height();
            console.log(featured_article_height_home_three)
            $("#ESG_Partner_Content_7").css('height', featured_article_height_home_three);

This code applies to each featured article on this page https://new.esgclarity.com/ and applies the height to the first item in the sidebar.

It actually only gets the first height correctly the second and third are wrong at first.