Widtn of the columns

Hi Paula,

thanks for your question.

Please see the answer to the question “How can I set column widths?” in the TablePress FAQ at https://tablepress.org/faq/ that has the necessary code for this.

Regards,
Tobias

Hello Tobias,

I get the code at faq, but I didn′t have sucess with it.
Also, I tried to change the color of the first row of table #3, and it didn′t work.

Could you help me with both questions ?
Thank you in advance.
Regards, Paula

‘.tablepress-id-1 .odd td {background-color: #ff9e5e;}
.tablepress-id-1 .even td {background-color: #ffc166;}
.tablepress-id-1 td {border: 2px solid #ffffff;}

.tablepress-id-N .column-1,
.tablepress-id-N .column-2,
.tablepress-id-N .column-3,
.tablepress-id-N .column-4,
.tablepress-id-N .column-5,
{width: 100px;}

.tablepress-id-2 .odd td {background-color: #ff9e5e;}
.tablepress-id-2 .even td {background-color: #ffc166;}
.tablepress-id-2 td {border: 2px solid #ffffff;}

.tablepress-id-3 .row-1 {background-color: #ff9e5e;}’

Hi Paula,

you need to adjust the table ID in the CSS code (N needs to be changed to the correct table ID).

To change the color for the first row, please see the question “How can I change the background color of the table head row?” in the FAQ. Your code needs some small adjustments.

Regards,
Tobias

Hello Tobias,

sorry for being repetitive.
I do need to change the CSS in the real code, not only in the plugin options ?

If I could send me the right code, I will be very happy ??

Regards, Paula

Hi Paula,

no, you’ll only have to put the code into the “Custom CSS” textarea on the “Plugin Options” screen. You must not edit any TablePress plugin files directly!

And you already have the necessary code ??
But here it is for copy/paste convenience:
Change the width of table 1:

.tablepress-id-1 th,
.tablepress-id-1 td {
  width: 20%;
}

The background color of the first row of table 3:

.tablepress-id-3 thead th {
  background-color: #ff9e5e;
}

Regards,
Tobias

Hello Tobias,

First of all, thanks for your help.
I have more questions:

1. Is it possible to join all codes related to table#1
.tablepress-id-1 .odd td {background-color: #ff9e5e;}
.tablepress-id-1 .even td {background-color: #ffc166;}
.tablepress-id-1 td {border: 2px solid #ffffff;}
.tablepress-id-1 th,
.tablepress-id-1 td {width: 20%;}

2. How can I centralize the titles in the first row and column (table 3 to 5)?

Thanks for your help.
Regards, Paula

Hi Paula,

1. Directly joining them is not possible, but you can of course put all CSS commands that affect table 1 underneath each other, as in your example.

2. You could use

.tablepress-id-3 .column-1,
.tablepress-id-3 .row-1 th {
  text-align: center;
}
.tablepress-id-5 .column-1,
.tablepress-id-5 .row-1 th {
  text-align: center;
}

for that.

Regards,
Tobias

Hi Tobias,
sorry for bothering you again, but I’m not very familiar with creating CSS and I can′t get the right structure.

Now I need help to:
* table #1: I dont wan′t to change the color when the mouse hover on the columns and lines. I want to have “fixed colors”.

* table #3: I want to use these colors in the table
background title row: #ff9e5e
background rows: #ffc166

Thanks for your kind help.
Regards Paula

Hi Paula,

no problem! I’ll gladly try to help!

For the first question: No CSS necessary here ?? Just uncheck the “Row Hover Highlighting” checkbox on the table’s “Edit” screen.

For the second question: Please try:

.tablepress-id-3 thead th {
  background-color: #ff9e5e;
}
.tablepress-id-3 tbody td {
  background-color: #ffc166;
}

and make sure to uncheck the “Alternating row colors” checkbox on the table’s “Edit” screen.

Regards,
Tobias

Hello Tobias,

the tables are almost ready …

for table 1 (5 columns) I used this code:
.tablepress-id-1 th,
.tablepress-id-1 td {width: 20%;}

for table 3, I have 6 columns, and the same code didn′t fit.
I have to change the % value to each number ?

Regards, Paula

Hi Paula,

well, if you have 6 columns the percentage value has to be changed to 100%/6 = 16.66%, i.e.:

.tablepress-id-3 th,
.tablepress-id-3 td {
  width: 16.66%;
}

Regards,
Tobias