TheRuniversity

Hi Tobias,

Not sure if a previous post went through:

I am able to get the background image to pop up perfectly but cannot get the original to disappear. Here is the code I am using:

‘.tablepress-id-3 .row-1 .column-2:hover {
background-image: url(http://theruniversity.com/wp-content/uploads/2015/12/Beer_mile_tile_v2.jpg);
background-size: 100% 100%;
background-repeat: no-repeat;
opacity: .4;
}

.tablepress-id-3 .row-1 .column-3:hover {
background-image: url(http://theruniversity.com/wp-content/uploads/2015/12/Beer_mile_tile_bg_v2.jpg);
background-size: 100% 100%;
background-repeat: no-repeat;
}

.tablepress-id-3 .row-1 .column-4:hover {
background-image: url(http://theruniversity.com/wp-content/uploads/2015/12/turkey-running_v2.jpg);
background-size: 100%;
background-repeat: no-repeat;
}

.tablepress-id-3 .row-1 .column-5:hover {
background-image: url(http://theruniversity.com/wp-content/uploads/2015/12/turkey-running_v2.jpg);
background-size: 100%;
background-repeat: no-repeat;
}’

Do I have to do a z-index or something? I am a newbies to CSS unfortunately.

Any help would be awesome! (send over a donation for what it’s worth)

Great plugin by the way! Here is the page with my table: Table

I was able to add a background image using:

.tablepress-id-3 tbody td {
	font-family: Tahoma;
	font-size: 18px;
	color: #ffffff;
}

.tablepress-id-43 .row-1 .column-1 {
	background-image: url(IMAGE-URL);
}

However, I am trying to have it only show the background image on hover which can be seen at RunWaterloo.com.

Thank you again.