Table show NO styling

Hi,

thanks for your question, and sorry for the trouble.

Can you please post a link to the page with the table where this problem happens, so that I can take a direct look? Thanks!

Regards,
Tobias

Incidentally, I’ve created several tables in the past and they worked fine (just in case you think I’m brand new to this and I’ve made a ‘newbie’ mistake). I’ve checked and checked. As far as I can tell I’ve done nothing unusual. And I spent hours yesterday trying to sort this out. This is a last resort – hoping someone can highlight the error of my ways, if I’ve slipped up, or advise me about something I’ve completely missed.

Thanks for replying Tobias, here’s the link:
https://www.real-memory-improvement.com/animals-alphabet-list.html
(I hadn’t yet published the page, but I’ve done that now so you can take a look).

Hi,

thanks for the link! I can see a table on that page (ID 72), which has the default styling of TablePress.
Additionally, the small piece of “Custom CSS” that you have on the “Plugin Options” screen (this:

.tablepress .column-1 {
	width: 100px;
}

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

) is working just fine.

So, there does not seem to be other “Custom CSS” here?!

Regards,
Tobias

I’m confused Tobias … I have created the Custom CSS for this table, I don’t know why this isn’t being applied.

How do you find the tiny bit of styling that was applied, is that visible when you ‘View source’?

Hi,

yes, this is what I see in “View source”.

Can you maybe create screenshot of the “Custom CSS” textarea on the “Plugin Options” screen, so that I can see what you added there?

Regards,
Tobias

Sorry, how do I attach the screenshot?

Hi,

you can’t directly attach it here, but e.g. upload it to https://imgur.com/ and post the link here.

Regards,
Tobias

Thanks! Here’s the link to the screenshot:

View post on imgur.com

Hi,

ok, so it seems that the “Custom CSS” textarea is also only showing that small piece of CSS code then.
Now, what styling are you missing then? Have you added CSS code somewhere else?

Regards,
Tobias

Yes, I’ve added the CSS styling the way I always have, which is to go to Appearance, then to Custom CSS Manager. This has always worked, up to now. Is there a particular reason why it doesn’t work in this case? The other tables are functioning okay, so it’s not like the whole system has changed, or failed to operate.

Hi,

ah, ok, now I see. You are adding all “Custom CSS” into a different plugin for this purpose. (This will of course work, although I usuall recommend to use the TablePress “Custom CSS” field for CSS that belongs to TablePress.)

From what I can see, this is caused by some syntax errors. CSS is very strict about braces, like { and }.
For example, there’s one } missing at the end of the block for

.tablepress-id-58 .row-2 td {

This causes most of the CSS after that to not be parsed.

There are some more errors which you should probably fix as well, see e.g. https://www.css-validator.org/validator?uri=http%3A%2F%2Fwww.real-memory-improvement.com%2F%3Faction%3Ddisplay_custom_css_code&profile=css21&usermedium=all&warning=1&lang=en#errors

Regards,
Tobias

Thank you, Tobias! As always, I learned something new from visiting your support site today. I’ll make a small donation later on.

May I just ask a couple of brief questions?

Should I just transfer the CSS styling for this table to the Tablepress Custom CSS section? (I’ve been using Tablepress for quite a while and I didn’t even know this existed!)

And would it be worth copying-and-pasting all the CSS that applies to the tables to the Tablepress Custom CSS section? (I can’t help thinking “If it ain’t broke, don’t fix it”).

I also wasn’t even aware of the CSS Validator. Should I copy sections from the “Valid CSS information” section and paste them in to replace my original CSS (obviously if I do that I’d do it one at a time, very carefully, checking on the page to see if nothing has gone wrong)?

And finally, were you able to see these errors by copying the link to the CSS file (from what is displayed on “View source”) and pasting it into the CSS Validator site? I suppose that must be the case, but I’m just not used to how it works.

Thanks again Tobias, you really are exceptional; it’s not many who can both create a really useful plugin and provide such excellent support!

Hi,

no, you don’t necessarily have to move the CSS from its current location to the TablePress “Custom CSS” field. Personally, I prefer to do it on my sites, as this assures that some CSS dependencies are correct. But everything can work just fine with the CSS in the current location as well.
By moving it, you maybe benefit from some extra caching and the minification of the CSS, but that effect should not really be measurable here.

And yes, I found those mistakes by looking at the CSS validator. I got the URL of the file with the custom CSS from “VIew source” and then pasted it into the validator.
You could indeed try copying the validated CSS from the site and replace your current CSS with it. It should be sufficient to take the error messages (and mentioned CSS selectors/lines of code) as hints for a manual check though. That way, you wouldn’t lose the good and helpful CSS comments that you have in the code. Also note that not everything that is reported is a “must fix”, like the reported missing properties.

Regards,
Tobias

Thanks again Tobias. One thing I’m not sure of: you say “… not everything that is reported is a “must fix”, like the reported missing properties”.

Which things are you referring to here?