Archived topic
( Read More ) Button alignment problem Fixing
18 replies · Started by Arif on January 13, 2022
Hello, Can you tell me how to fix this ( read more ) button alignment. Read More button 1 & 3 okay , but 2 alignment is not good, Please check it : https://ibb.co/QQpjb6h
Hi Arif,
Any chance you can link us to the site in question?
You can use the private information field.
https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information
Let me know :)
Please, Check it.
Try this CSS:
.blog p.read-more-container, .archive p.read-more-container {
margin-top: auto;
}
.blog .entry-summary, .archive .entry-summary {
flex: 1;
}
.generate-columns .inside-article, .blog .entry-summary, .archive .entry-summary {
display: flex;
flex-direction: column;
justify-content: space-between;
}
I don't know how to add this ?
You can add it to customizer > additional CSS.
customizer > additional CSS > then paste the code anywhere... Am i right?
Yes, correct.
Do you already have other CSS in the field?
If so, paste it in front of other CSS.
yes, here i see some css code, around 70 line . Did i remove them and paste it ?
Don't remove them, the code must be doing something to your current layout.
Just paste the new CSS code in :)
Great it is working. But page alignment text is not correct position. How do i do that?
You can change the content container paddings at customizer > layout > container > content padding.
But i can try it. But it also decreases my Home page Column padding.
Check the attachment
The customizer option applies for the entire site, I would recommend you set around 40px at customizer > layout > container > content padding.
Then add this CSS to modify the paddings around the posts on blog and archive pages.
.generate-columns .inside-article {
padding: 30px 10px 5px 10px;
}
The 4 values are presenting top/right/bottom/left paddings around the post, please refer to the screenshot below:
https://www.screencast.com/t/lQoB5e4VqeJ
But here is a problem, when i go to customizer > layout > container > content padding setting and set 40x it is also works on home page and Privacy Policy page. But I need it on a separate page. Not in Home page. I need padding on just this page ( Privacy policy , About us , Contact Us) how to i do that separately? Kindly check the attachment.