Hallo Felix,
Also sieht das Ergebnis so aus:
<td class="headdesc"> oder <td class="headasc">
Nein, so:
class="head desc"
Dazu nun Dein CSS:
.mytable thead .asc:after {...} .mytable thead .desc:after {...}
Mein css:
/* Pseudo-Elemente für die aufsteigende/descendig Dreiecke */
.eingangsRG thead .asc::after {
content: '';
display: inline-block;
width: 0;
height: 0;
border-style: solid;
border-width: 0 5px 8px 5px;
border-color: transparent transparent #fff transparent;
background-image: url('./icons/icons.svg#up');
background-repeat: no-repeat;
background-position: right center;
background-size: contain; /* Hintergrundbild auf die Größe des Elements skalieren */
float: right; /* Element rechts ausrichten */
}
.eingangsRG thead .desc::after {
content: '';
display: inline-block;
width: 0;
height: 0;
border-style: solid;
border-width: 8px 5px 0 5px;
border-color: #fff transparent transparent transparent;
background-image: url('./icons/icons.svg#down');
background-repeat: no-repeat;
background-position: right center;
background-size: contain; /* Hintergrundbild auf die Größe des Elements skalieren */
float: right; /* Element rechts ausrichten */
}
So funktioniert es gut.
Anders habe ich die Dreiecke nicht hinbekommen, ich habe alle Varianten aus Rolfs Link ausprobiert.
Rick