Need help with custom CSS

Hi!

I not almost nothing about CSS so I really need help!
I’ve implemented a price table on my affiliate site which automatically updates the prices if they’re changed on the webshop where I found them. The problem is with the layout - as you can se here https://babyhelp.dk/pusletasker/ if you scroll down a little you’ll see the tables I’m talking about.

I would like everything to be centered in the little boxes instead of aligned to the left. How do I go about doing this?

The code that needs editing is this:

.afp-table tbody tr td.afp-table_readmore a {
    padding: 8px;
    color: #fff;
    background: #2de035;
    border-radius: 5px;
    font-size: 12px;
    text-align: center;
    font-weight: 700;
    min-width: 150px;
    max-width: 150px;
    margin: 0 15px;
    text-transform: uppercase;
    margin: auto;
    display: block;
    -webkit-transition: all .15s ease-out;
    -moz-transition: all .15s ease-out;
    transition: all .15s ease-out;
}

Thanks in advance!

Welcome to the forums, @findenkaereste4.

If I’ve understood what you’re asking, then you just need to add this rule:

.custom-table {
    text-align: center;
    }
1 Like

But that line is already in the code, isn’t it?

As far as I can see, you have no rules at all which target .custom-table.

Try inspecting the element in your browser tools and adding that rule to see if it has the desired effect.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.