Gunnar Bittersmann: Wert aus Attribut im CSS verwendbar? Also calc() und attr() kombinierbar?

Beitrag lesen

@@Matthias Apsel

span[data-priority]
{
	border-width: calc(var(--data-priority) * 2px);
	border-style: solid; 
	border-color: red;
}

span[data-priority="1"] { --data-priority: 1 }
span[data-priority="2"] { --data-priority: 2 }
span[data-priority="3"] { --data-priority: 3 }

Wo wäre der Vorteil gegenüber

[data-priority="1"] { border-width: 2px; }
[data-priority="2"] { border-width: 4px; }
[data-priority="3"] { border-width: 6px; }

Dass man die Berechnung dem Rechner überlässt. (No pun intended.™️)

Es wären ja auch kompliziertere Operationen als * 2px denkbar.

LLAP 🖖

--
“When UX doesn’t consider all users, shouldn’t it be known as ‘Some User Experience’ or... SUX? #a11y” —Billy Gregory