HTML table cells color wrong in reading mode

Steps to reproduce

Open Appimage (no matter, deb works the same) sandbox, new note, write:

<table>
<tr>
<th>Heading A</th>
<th>Heading B</th>
<th>Heading C</th>
</tr>
<tr>
<td class="bg-green">Cell A</td>
<td class="bg-green">Cell B</td>
<td class="bg-green">Cell C</td>
</tr>
<tr>
<td bgcolor="red">Cell D</td>
<td bgcolor="red">Cell E</td>
<td bgcolor="red">Cell F</td>
</tr>
</table>

No snippets used in this case, but CSS works the same.

Expected result

As I see in preview (edit) mode:
Screenshot from 2024-02-22 14-42-53

Actual result

At read mode, every even cell in every row is no colored:
image

Environment

SYSTEM INFO:
Obsidian version: v1.5.3
Installer version: v1.5.3
Operating system: #17~22.04.1-Ubuntu SMP PREEMPT_DYNAMIC Tue Jan 16 14:32:32 UTC 2 6.5.0-17-generic
Login status: not logged in
Insider build toggle: off
Live preview: on
Base theme: dark
Community theme: none
Snippets enabled: 0
Restricted mode: on

RECOMMENDATIONS:
none


Additional information

Before I installed obsidian v.1.5.3 and checked this bug, I’ve caught it in v.1.2.??

this is not a bug. You style is overwritten by another by another rule in the reader view. Moved to help.

Bug or feature, well, it turns out that the default CSS used by Obsidian is this line:

.markdown-rendered tbody tr > td:nth-child(2n+2) {
    background-color: var(--table-column-alt-background);
}

And this overrides your specification of bgcolor due to CSS specificity rules. So the default configuration for allowing for alternating column background color, is just on the edge related to the specificity, so non-even columns is ruled by bgcolor, and even column is governed by the rule above.

To ensure that your markup has high enough specificity, you could use:

<td style="background-color: red !important">Cell E</td>

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.