.mkdf-blog-list-holder .mkdf-blog-list {
position: relative;
width: 100%;
vertical-align: middle;
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-wrap: wrap;
}
.mkdf-blog-list-holder .mkdf-bli-inner {
position: relative;
display: inline-block;
width: 100%;
vertical-align: middle;
height: 100%;
}
.mkdf-blog-list-holder .mkdf-bli-content {
position: static;
display: inline-block;
width: 100%;
vertical-align: middle;
box-sizing: border-box;
}
.mkdf-blog-list-holder .mkdf-post-read-more-button {
position: absolute;
display: inline-block;
width: 100%;
vertical-align: middle;
margin: 0;
bottom: 0;
left: 0;
}
.mkdf-blog-list-holder .mkdf-bli-inner {
position: relative;
display: inline-block;
width: 100%;
vertical-align: middle;
height: 100%;
padding: 0 0 30px;
}
.mkdf-normal-space .mkdf-outer-space .mkdf-item-space {
padding: 0 15px 40px;
margin: 0 0 30px;
}
might not be totally correct due to your classes but that’s basically how to do it.
Make your list flex and flex-wrap
make the inner div 100% height
make the div wrapping the button position static
make the button absolute
add bottom padding to the containers so the button never overlaps content
Hi thanks so much, that worked, the issue is fixed across all pages!
