# Chromium Tabellenrand-Bug(?) mit Gradienten

**URL:** <https://meta.discourse.org/t/chromium-table-border-bug-with-gradients/286895>\
**Category:** Development\
**Tags:** css\
**Created:** [28. November 2023 um 22:19 UTC](https://meta.discourse.org/t/chromium-table-border-bug-with-gradients/286895 "2023-11-28T22:19:31Z")\
**Posts on this page:** 1\
**Showing post:** 1

<div class="post-metadata">

**Author:** ![polyzium](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/polyzium/32/344527_2.png) [@polyzium](https://meta.discourse.org/u/polyzium)\
**Post date:** [28. November 2023 um 22:19 UTC](https://meta.discourse.org/t/chromium-table-border-bug-with-gradients/286895/1 "2023-11-28T22:19:31Z")

</div>

Hallo Leute. Wir haben angefangen, unser Forum von proprietärem Xenforo auf Open-Source Discourse umzustellen, und im Zuge der Nachbildung der visuellen Elemente unseres alten Forums bin ich auf ein Chrome-spezifisches CSS-Problem gestoßen.  
**Ich weiß nicht, ob sonst noch jemand auf dieses Problem gestoßen ist, ich konnte hier keine anderen Forenthemen dazu finden.**

Ich habe versucht, einen Farbverlauf auf alles anzuwenden, was eine Tabelle ist, in diesem Fall die Kategorie- und Themenliste.  
Unter Firefox sieht es so aus, wie es sollte:

> **Screenshot**
>
> ![image](https://global.discourse-cdn.com/meta/original/4X/2/0/d/20dbb6afb562500a07c0298d944e6a26aa1278d0.png)

Aber Chromium-basierte Browser scheinen einen zusätzlichen Rand zu rendern:

> **Screenshot**
>
> ![image](https://global.discourse-cdn.com/meta/original/4X/f/6/3/f63a4fcc914b5b7445730f0c82932468b68d1d44.png)

Und hier ist das fragliche CSS (am Beispiel der Kategorie-Liste innerhalb einer Kategorie):

> **Code**
>
> ```css
> #header-list-area .category-list > thead > tr {
> border-color: #a3a3a3;
> background-image: linear-gradient(to right, #a3a3a3, #424242);
> }
> .category-list > thead > tr {
> border-width: 0px;
> border-left-width: 6px;
> border-style: solid;
> }
> 
> ```

Wenn ich `background-color` verwende, rendern beide Browser die `<th>` identisch, d.h. ohne den zusätzlichen überlagerten Rand.

Ich konnte dieses Problem mit reinem HTML+CSS, Codepen oder ähnlichen Tools nicht reproduzieren. Wenn Sie sich mit dem DOM und den CSS-Selektoren/Regelsätzen von Discourse auskennen, wäre Ihre Hilfe sehr willkommen.

---

_[View the full topic](https://meta.discourse.org/t/chromium-table-border-bug-with-gradients/286895)._