Question 183241 in Wordpress Question posted in
The official Wordpress documentation can be found here.

WordPress – How to change the style of the "Read More" button in the elementor card

I am a beginner in wordpress, and I am having a problem creating custom CSS code to edit a button on a card. I would like to align the "Read more" button in the center of the post card and add borders to it, but in elementor, I’m not getting it. I tried editing custom code just for the attribute where the button is, however, it changes the whole card and centers both the text and the description.

Currently my result is as in the image below.

Currently

I would like to leave it like this:

I need like this

I tried to create a custom code, but I am a CSS beginner, and it is changing all the title, description and the button, here is my code:

a.elementor-post__read-more {
    width: 100%;
    color: #000;
    text-align: center;
    background-color: #ffd9d9;
    border-radius: 6px;
    margin-top: auto;
}
Tags:

2

Answers


  1. 0

    The a is unneccessary in finding the element, you should just use the class, .elementor-post__read-more.

    .elementor-post__read-more { 
 width: 100%; 
 color: #000; 
 text-align: center;
 background-color: #ffd9d9; 
 border-radius: 6px; 
 margin-top: auto; 
}

    If it still applies to all title, description and button elements search for all instances of elementor-post__read-more as a class insode the page to see if see other elements will be affected

    Login or Signup to reply.
  2. 0

    You can try this CSS!!

    .elementor-post__read-more {

    display: flex;
justify-content: center;
align-items: center;
text-align: center;
width: 100%;
margin-top: 15px;
padding: 10px 20px;
border: 1px solid #000;
border-radius: 6px;
color: #000;
background-color: #ffd9d9;
text-decoration: none;
transition: all 0.3s ease;

    }

    .elementor-post__read-more:hover {

    background-color: #ffcaca;

    }

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search