Hi,
thanks for your post, and sorry for the trouble.
There’s not really much space around the table, only the cell padding. Try this new “Custom CSS”:
.tablepress-id-2 {
width: 300px;
float: left;
background-color: rgb(27,27,27,0.5);
margin: 0 !important;
}
.tablepress-id-2 tbody td {
padding: 0;
}
Then, you should slightly change the HTML structure in the cells: You should not need the <p> around the image, so I suggest to remove that.
Then, there are some extra line breaks at the end of the cell which also add white space.
Regards,
Tobias
wow Tobias you are THE MAN! thanks a lot for your quick answer
there are some extra line breaks at the end of the cell which also add white space.
I have modified all, and still have a little space at the bottom of the cell , do you detect anything strange in the code?
Do you know if there is any way to increase the space between text lines in the cell or table (line height) ?
tks a lot for your support!
Hi,
I don’t see space at the bottom of the cell, there’s only that black image.
To increase the line height, just add something like
line-height: 20px;
to the second block in the CSS from above.
Regards,
Tobias
oh Tobias I am very happy as I aligned the image to the bottom using a piece of code from this forum (worked!), and now all custom css is :
.tablepress-id-2 {
width: 300px;
float: left;
background-color: #2d2d2d;
margin: 0 !important;
}
.tablepress-id-2 tbody td {
padding: 0;
line-height: 20px;
}
.tablepress .row-hover tr:hover td {
background-color: #3b3b3b;
}
.tablepress-id-2 img {
vertical-align: bottom;
}
My final doubt is: do you know if there is any way to add a little of margin in the left and right sides of the text inside this column?
Thanks a lot, again !!
Hi,
you could add some padding on the left and right. Just change
padding: 0;
to
padding: 0 5px;
Regards,
Tobias
perfect Tobias, many thanks for your support! all worked!! 😀
do you perhaps know, how to set an specific background color (on mouse over) for each colum inside of a table?
I have this code, but it affects all colums the same on mouse over, and I don’t need that :
.tablepress-id-1 .row-hover tr:hover td {
background-color: #cccaca;
I need (on mouse over):
columnA=color1 / columnB=no color / columnC=color1 / column4=no color
http://www.phonecovers.tk/
thanks for your help !
Hi,
you’ll basically just have to move the :hover to the columns:
.tablepress-id-1 tr .column-1:hover,
.tablepress-id-1 tr .column-3:hover {
background-color: #cccaca;
}
Just to make sure that nothing interferes, you should then also turn off the Row Highlighting feature on the “Edit” screen.
Regards,
Tobias
MAGIC Tobias !!! You are number one.
T H A N K S !
Hi,
no problem, you are very welcome! 🙂 Good to hear that this helped!
Best wishes,
Tobias
P.S.: In case you haven’t, please rate TablePress here in the plugin directory. Thanks!
