Archived topic
Change space between tiles in blog section
5 replies · Started by finanzbeben on January 14, 2023
Hi there,
Currently, I am trying to change/reduce space between single tiles of the blog page.
Therefore, I have implemented the following code in "additional CSS":
.footer-widgets .widget:last-child, .sidebar .widget:last-child{
margin-top: 30px;
}
.one-container.archive .post:not(:last-child), .one-container.blog .post:not(:last-child) {
padding-bottom: 0px;
padding-right: 30px;
}However, this does not bring the needed results as I am looking for a solution where all blog post in the blog archive are having the same space to all directions. Also, the last child should fit to the rest padding-wise. Any idea how I can achieve this?
Kind regards
Hi there,
can you remove the CSS you have added so far, and then i can take a look at whats required.
Hi David,
Thanks for reaching out despite Sunday.
I have removed the CSS now. Please take a look.
Kind regards
Try adding this CSS:
.generate-columns {
margin-bottom: 30px;
padding-left: 30px;
}
.generate-columns-container {
margin-left: -30px;
}
.generate-columns-container .post {
padding-bottom: 0px !important;
}Then for extra bonus points add this CSS:
.generate-columns > .gb-container,
.generate-columns > .gb-container .gb-inside-container {
height: 100%;
}
.generate-columns > .gb-container> .gb-inside-container {
display: flex;
flex-direction: column;
}
.generate-columns > .gb-container> .gb-inside-container>:last-child {
margin-top: auto;
}It will make sure all posts in the same row are the same height, and it will align their footer metas.
Hi David,
Thank you so much. Looks fantastic. This is exactly what I was looking for!
Kind regards
Glad to be of help!