Need help with custom CSS

HTML & CSS
1

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!

2

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
3

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

4

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.

5

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