Change table width

Resolved horcrrux
(@horcrrux)

12 years, 3 months ago
http://petportra.com/prices/

I used this code to change the column width’s,
```
.tablepress-id-2 .column-1 {
	width: 120px;
}

.tablepress-id-2 .column-2 {
	width: 100px;
}

.tablepress-id-2 .column-3 {
	width: 100px;
}
```
which worked when I did it for the first two columns, but once I added the third, it just all stretched out again. I don’t want the table to stretch across the whole page like it is now, I’d rather have the columns no longer than they have to be to fit the text in 🙂

Also, used this code to change the colors of the rows:
```
.tablepress .odd td {
	background-color: #eeeeee;
}

.tablepress .even td {
	background-color: #ffffff;
}
```
but the odd rows still stay the same color as they were before (#f2f7fc)
🙂

https://ww.wp.xz.cn/plugins/wp-table-reloaded/

Viewing 7 replies - 1 through 7 (of 7 total)

Plugin Author Tobias Bäthge
(@tobiasbg)

12 years, 3 months ago
Hi,

thanks for your post, and sorry for the trouble.
(By the way, you posted in the old WP-Table Reloaded forums, but that’s ok 🙂 )

If you don’t want the table to stretch to the full width, you’ll need to add this as well:
```
#content .tablepress-id-2 {
  width: auto;
}
```
(The #content is necessary because your theme otherwise overwrites this setting with its own CSS.)

For the colors, your theme also overwrites this, so just extend the code to
```
#content .tablepress .odd td {
	background-color: #eeeeee;
}

#content .tablepress .even td {
	background-color: #ffffff;
}
```
Regards,
Tobias
Thread Starter horcrrux
(@horcrrux)

12 years, 3 months ago

Whoops, my bad 🙂 Thank you so much, and very quick reply!! 🙂

Plugin Author Tobias Bäthge
(@tobiasbg)

12 years, 3 months ago

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!

by_Slonik
(@by_slonik)

12 years ago

Hi, Tbias! How i can vary size my tables. I want relative width. How can I do it?
Plugin Author Tobias Bäthge
(@tobiasbg)

12 years ago
Hi,

thanks for your post, and sorry for the trouble.
The easiest way for that should be to use some “Custom CSS” like
```
.tablepress-id-123 {
  width: 60%;
}
```
where 123 needs to be changed to your table’s ID.

Regards,
Tobias
by_Slonik
(@by_slonik)

12 years ago

Exactly where I need to insert this code? In the code of the theme in the plugin code?

Plugin Author Tobias Bäthge
(@tobiasbg)

12 years ago

Hi,

you can enter this into the “Custom CSS” textarea on the “Plugin Options” screen of TablePress.

Regards,
Tobias

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘Change table width’ is closed to new replies.

Tags