Site logo

Archived topic

Align the Read more button

1 reply · Started by 24xstudio on August 14, 2019

Viewing posts 1–2 of 2

Hey,

The read more buttons are not correctly aligned on the homepage (both on desktop and mobile). Kindly check and suggest.

You're using this CSS to float the element right:

.entry-summary a {
border-bottom: 2px solid rgba(45, 130, 230, 0.4);
float: right;
}

Floats allow an element to float up if the space is available. Instead of using Floats try this CSS:

.separate-containers .inside-article {
    position: relative;
}

.separate-containers .inside-article .entry-summary a {
    position: absolute;
    right: 20px;
    bottom: 40px;
}

/* Add extra padding on smaller devices */
@media (max-width: 1024px) {
    .separate-containers .inside-article {
        padding-bottom: 80px;
    }
}
This archived topic is closed to new replies.