learningwp256

Would something like this work? (Link and code below)
(https://alt-web.com/DEMOS/CSS-Clickable-Table-Cells.shtml)

table.prod {
width: 600px;
border-collapse:collapse; border:none;
}

.prod a img {
border:none;
float:left;
padding-right:12px;
}

.prod td {
width:200px;
border: 1px solid #000
}

.prod td p {
margin:0;
line-height: 1.2em;
font-size: 16px;
}

/**here’s the magic part**/

.prod td a {
display:block;
height:7em; /**adjust height in ems as required**/
text-decoration:none;
}

/**link states**/

.prod td a:link {color: #000}

.prod td a:visited {color:#666}

.prod td a:hover, .prod td a:active, .prod td a:focus {
background-color:#CCFF00
}

HTML Code

<table class=”prod” cellspacing=”0″ cellpadding=”0″>

<tr>
<td><p><img src=”your-image.png”/>Some link text goes here</p></td>

<td><p><img src=”your-image.png”/>Some link text goes here</p></td>

<td><p><img src=”your-image.png”/>Some link text goes here</p></td>

</tr>

<tr>
<td><p>Some link</p></td>
<td><p>Some link</p></td>
<td><p>Some link</p></td>

</tr>

</table>

Worked great! I went ahead and did an :after also.

Why did you choose a max-width of 620?

Would using a fixed table width or column width help in getting more of the table on the screen?

Sorry second link for horizontal scrolling is:

https://www.selectasitterservice.com/types-of-sitters/

That worked! Thanks so much!

Try again:

I am trying to use a css button in tablepress that has a link. It is working except the link text is using the theme styling for links. I want the text to be white.

In the table I am using I am using:
<a href="link" class="tablepress-button">Visit</a>

In the Plugin options I’m using:

`.tablepress-button {
-webkit-border-radius: 6;
-moz-border-radius: 6;
border-radius: 6px;
font-family: Arial;
color: #ffffff;
font-size: 15px;
font-weight: bold;
background: #3152ac;
padding: 4px 12px 4px 12px;
margin: 12px 6px 8px 6px;
text-decoration: none;
}

.tablepress-button:hover {
text-decoration: none;
}

.tablepress-button a:link {
color: #ffffff !important;
}

.tablepress-button a:visited {
color: #ffffff !important;
}

.tablepress-button a:hover {
color: #ffffff !important;
}

.tablepress-button a:active {
color: #ffffff !important;
}

I asked a similar question a couple days ago. It was titled “Color Schemes”. I wanted to use different color schemes and used the info from Tobias reply. So now I have a couple of color schemes and another type for one column tables that I’m putting in a sidebar. After creating the css in the plugin option just need add the class into the “Extra CSS classes” textfield of the tables.

https://www.ads-software.com/support/topic/extra-css-classes?replies=6