OK home now.
So a few things of note with this. I wasn’t aware of the odd behaviour the snippet was having on other tables. I honestly don’t use tables a whole lot so that makes sense.
First for @Moonbase59 and your snippet. The problem you are running into with your snippet is that you are using the “!important” tag to make your rules higher in specificity than is necessary. Instead, just remove/change the line in the initial snippet. (I did this and re uploaded a copy so feel free to just download that if you want.
@Jeffurry for adjusting anything with a css class, the css class is loaded into the body element. So you would want to start any selector off with that then go down to the desired level of the selector. So if you wanted to change tables inside preview panes for that CSS class you’d call the body with the css class then markdown preview then table:
body.tables-auto-left .markdown-preview-view table{
rules: go here
}
On a bit more of a meta conversation, when you encounter something like this here are some things to keep in mind:
-
If an author’s theme or snippet is having odd behaviour let them know. They probably aren’t aware and most are happy to fix it.
-
Also having them fix it will not only be a better solution for you, but also fix it for other people who had no idea where a problem originated.
-
If that isn’t an option, go change the original code if possible before overriding it with the !important flag. The other troubles that come afterward usually stem from being unable to override that high level of specificity.
-
As a rule of thumb you should strive to only use important tags to override styles added directly into the html code. And even in those questions ask yourself if there is another way since the developers usually have good reasons for it.
Hope that helps.
Here’s the snippet again if you need:
