How to make the “Portfolio Gallery – Image Gallery Plugin for WordPress” display all thumbnails with the same height?

Puneet Sharma

4 years ago

Here is a CSS code you can apply to your theme to make “Portfolio Gallery” – Image Gallery Plugin for WordPress – https://wordpress.org/plugins/portfolio-filter-gallery/ , display thumbnail images with the same height for all images with variable heights.

DEMO

Open demo in a full window – https://projects.webdevpuneet.com/wp/demo1/portfolio-filter-gallery-thumbnails-with-equal-heights/

Apply the following CSS code to the Custom CSS section in your theme or in the “custom CSS” space inside the plugin. Before applying CSS it looked like this – https://projects.webdevpuneet.com/wp/demo1/portfolio-filter-gallery/

Custom CSS

.pfg-bootstrap .thumbnail{
	border:none!important;
}
.filtr-item{
	height:200px;
}
.filtr-item img{
	min-width:100%;
	min-height:200px;
}
@media( max-width:400px ){
	.filtr-item{
		height:175px;
	}
	.filtr-item img{
		min-height:175px;
	}
	.item-desc{
		font-size: 14px;
	}
}

Screenshots

Before

After applying CSS

You can also use this cool image resizer and compressor tool to minify the size of your images for better website page load speeds.