Width Control

Resolved jphipps
(@jphipps)

10 years, 10 months ago

Am using the following tablepress css:

.tablepress-id-4,
.tablepress-id-4 tr,
.tablepress-id-4 tbody td,
.tablepress-id-4 thead th,
.tablepress-id-4 tfoot th {
width: 300px;
}

.tablepress-id-4 .column-1 {
font-weight: bold;
column-width: 33%;
text-align: center;
width: 100px;
}

.tablepress-id-4 .column-2 {
font-weight: bold;
column-width: 33%;
text-align: center;
width: 100px;
}

.tablepress-id-4 .column-3 {
font-weight: bold;
column-width: 33%;
text-align: center;
width: 100px;
}

The preview in Tablepress shows the table as desired, however, the actual table spreads across the full space of the column in wordpress – the 300px does not work – as seen on this page – http://www.phem.com/investment-casting-tolerances-and-materials/

http://wordpress.org/extend/plugins/tablepress/

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

Plugin Author TobiasBg
(@tobiasbg)

10 years, 10 months ago
Hi,

thanks for your question.

This CSS contains some invalid properties and too aggressive selectors. Please try this instead:
```
.tablepress-id-4 {
  width: 300px !important;
}
.tablepress-id-4 thead th {
  font-weight: bold;
  text-align: center;
}
.tablepress-id-4 tbody td {
  font-weight: bold;
  text-align: center;
  width: 100px;
}
```
Regards,
Tobias
estuffs
(@estuffs)

10 years, 10 months ago

To piggy off this
1) Is there a way for me to do this for all tables? Is it a matter of replacing .tablepress-id-4 with .tablepress

2) Also, my “thead th” seems to be overwritten by my current theme settings.

.entry table thead th {
background: #fafafa;
border-right: 1px solid #eee;
border-bottom: 1px solid #eee;
text-transform: uppercase;
padding: 1.387em;
vertical-align: middle;

I tried using, the code below, but its not taking it.

.tablepress table thead th {
background: #fafafa;
border-right: 1px solid #eee;
border-bottom: 1px solid #eee;
text-transform: none;
padding: 5px;
vertical-align: middle;
}

Thanks in advance.
Plugin Author TobiasBg
(@tobiasbg)

10 years, 9 months ago
Hi,

thanks for your question, and sorry for the late answer. As I was on vacation, I didn’t have a chance to reply earlier.

1.) Yes, just replace .tablepress-id-4 with .tablepress.

2.) You are right, that theme CSS would override your “Custom CSS”. You’ll just have to make your CSS selector more important, by changing it to
```
.entry .tablepress thead th {
```
Regards,
Tobais

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

The topic ‘Width Control’ is closed to new replies.

Tags