How to put a css button with link to amazon inside tablepress? Html help

[freckletone]

Some of my competitors have these lovely tablepress tables (product comparison) and at the botton they use custom css to create a link that says "view at amazon"... but it's inside a colored button (a button link inside the table to amazon) ... so if there is four columns, there are four button links "view at amazon" in the last column of every column.. how do they insert a button link inside the table?

I entered this code into my custom css


.buttonize {
max-width:100%;
padding:10px 20px;
background:rgba(0,0,0,1);
color:white;
box-shadow:1px 1px #000;
margin:20px auto;
float:left;
transition:all .2s ease-in-out
}
.buttonize:hover {
background:rgba(0,0,0,.75);
}

and in tablepress entered this




<a href="http://www.mylink.com" class="buttonize">View At Amazon</a>

but its appearing as a text and not button...

am i supposed to enter something extra under "Extra CSS Classes:"?
I tried entering : buttonize
but it doesn't work.

The button is working on other pages, just not inside tablepress

 

[freckletone]

Ok and I have to admit I cannot code.. also which field do i edit in order to change the background of the button from black to yellow or some other color?

.buttonize {
max-width:100%;
padding:10px 20px;
background:rgba(0,0,0,1);
color:white;
box-shadow:1px 1px #000;
margin:20px auto;
float:left;
transition:all .2s ease-in-out
}
.buttonize:hover {
background:rgba(0,0,0,.75);

 

[Zalcad]

background:rgba(0,0,0,1); <---- button color

 

[freckletone]

background:rgba(0,0,0,1); <---- button color

Thank you! It worked!

Also the yellow buttons do work once i entered the table in my page.. it just wasnt showing up when i pressed preview but it works now!