Page in Question: click here
I tried to use position:absolute to fix the “Read More” button to the bottom of each div/post box (and centered).
If I have more than one row of posts, the buttons only attach themselves to the very bottom of the page. Right now the spacing is off too, and the read more buttons are over the page numbers.
Please help!
@aloha1. Welcome to the SP forums. Did you allteady fix it? When I look at the different blockposts I see a Read More button (green) centered under each title.
Edit: Anyhow, when you would like to have the “Read More” buttons positioned absolute, the parent of these buttons, should be positioned relative
I’m not seeing that. I do however see “listen now” covering the “next” side of the pagination menu.
Yes, right now I see this:
There are only 3 listen now buttons at the very bottom of the page instead of 6 listen now buttons at the bottom of the boxes.
But my goal is to have the listen now buttons be styled more like this: http://jesslively.com/livelyshow/
I will go through the links @ronpat shared!
@aloha1. I think you should set position relative on elementor-post:
.elementor-post {
position: relative;
}and the following properties for the buttons:
.elementor-post__read-more {
position: absolute;
top: 100%;
left: 50%;
transform: translate(-50%, -50%);
// I don't know the other properties for the buttons
}For a slight improvement I would do it like this:
.elementor-post {
position: relative;
}
.elementor-post__read-more {
position: absolute;
top: auto;
bottom:1px;
left:0;
right:0;
width:50%;
margin:auto;
}
Note these are over-ride styles and should follow after the original rules.
The site is actually built with grid and flexbox so it should have been possible to put the text at the bottom without using absolute position at all but would probably require some mark up changes.
@PaulOB You’re absolutely right 
I didn’t look that far 
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.