The thumbnails in this code are displaying correctly in FF and Chrome but in IE they are being displayed based on their ratio.
I have 50px set as the length and height and all the thumbnails are perfect squares in FF and Chrome. In IE however, because they are being re-sized based on some ratio, some thumbnails are appearing skinny while others are displaying correctly with the 50x50 dimensions. However, all the thumbnails are still within the 50x50 boundary, just that some are skinnier than the others.
function posts_in_cat( $atts ) {
$atts = shortcode_atts( array(
'cat' => '',
), $atts );
if ( empty( $atts['cat'] ) ) {
// If category provided, exit early
return;
}
$args = array(
'category' => $atts['cat'],
// Disable pagination
'posts_per_page' => -1
);
$posts_list = get_posts( $args );
if ( empty( $posts_list) ) {
// If no posts, exit early
return;
}
$opening_tag = '<ul style="list-style-type:none; padding-left:2px; display:block; clear:both;">';
$closing_tag = '</ul>';
$post_content = '';
foreach ( $posts_list as $post_cat ) {
$post_content .= '<li class="highlightli" style="line-height:1.2em; margin-bottom:10px; display: flex !important; align-items: center !important;">' . get_the_post_thumbnail($post_cat->ID, array(50,50), array( 'class' => 'imgspecialalignleft' )) . '<a href="' . esc_url( get_permalink( $post_cat->ID ) ) . '">' . esc_html( get_the_title( $post_cat->ID ) ) . '</a></li>';
}
return $opening_tag . $post_content . $closing_tag;
}
