Archived topic
Aligning the readmore button
5 replies · Started by mkjj on July 14, 2021
This question has been asked before. Like others, we would like to have the readmore button aligned to the bottom. I tried this solution:
https://generatepress.com/forums/topic/align-the-read-more-button-2/
It works in the first row, but not in the second. Do I miss anything?
https://doriskirch.de/achtsamkeits-blog/
Thank you very much.
Hi there,
You can try add this CSS as well:
.one-container.archive .post, .one-container.blog .post {
padding-bottom: 40px !important;
}
The 40px should match the value you set at Customizing > Layout > Container > Content Padding > Bottom.
Let me know if you need further assistance :)
Thank you very much. This did the trick. Since I try to avoid !important in my CSS, I changed the padding to 0. But I'm pretty sure that 40px is the default value.
What would be best practice in this case? I'm sure, that the aligment of the readmore buttons is something most users want on their sites. What would you recommend? I can't really see any difference on other elements after setting the bottom padding to 0.
Thanks for the great support!
Hi there,
the content padding gets applied to all posts except for the last one, it eliminates an unnecessary gap on smaller devices.
If you set the content padding to 0 in the customizer its going to affect ALL content including single posts.
The use of !important is only a bad thing when theme/plugin developers resort to using that. Using it to overwrite a fixed style is all ok :)
However if you must kill the !important then do this:
@media(min-width: 769px) {
#page .generate-columns-container .post:last-child {
padding-bottom: 40px;
}
}
Make sure the 40px matches your customizer padding.
Thanks David. Excellent solution!
Glad to be of help!