Inner wrapper DIV for the excerpt text

Hey derx,

Could you post a link to the site in question so that we can take a closer look please?

Best regards,
Rikard

Hi,

Thanks for that, so you are looking for the excerpt with button to be the same height all the time, I’m assuming? If not then please try to explain a bit further or post a screenshot highlighting your intentions.

Best regards,
Rikard

Hi,

Please add this script in the functions.php file.

// custom script
add_action( 'wp_footer', 'ava_custom_script' );
function ava_custom_script() {
?>
<script type="text/javascript">
(function($) {
  function a() {
    // Get an array of all element heights
    var elementHeights = $('.slide-entry-excerpt').map(function() {
      return $(this).height();
    }).get();

    // Math.max takes a variable number of arguments
    // <code>apply</code> is equivalent to passing each height as an argument
    var maxHeight = Math.max.apply(null, elementHeights);

    // Set each height to the max height
    $('.slide-entry-excerpt').height(maxHeight);
  }

  $(window).resize(function() {
      setTimeout( a(), 1500 );
  });
})(jQuery);
</script>
<?php
}

And then add the following css codes in the Quick CSS Field.

.avia-content-slider .slide-entry-excerpt {
    overflow: hidden;
    text-overflow: ellipsis;
    padding-bottom: 100px;
}

.html_elegant-blog .avia-content-slider .read-more-link {
    position: absolute;
    top: auto;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
}

The code will get the height of the tallest excerpt container and then apply it to the rest.

Based on: https://stackoverflow.com/questions/6781031/use-jquery-css-to-find-the-tallest-of-all-elements

Don’t forget to remove the browser cache or hard refresh before checking the page.

Best regards,
Ismael