CSS -Attribute, um die Anzeigebreite eines Objekts anzupassen ⇐ HTML

[Anonymous]

In einer Web -App (next.js/react) zeige ich ein paar Elemente mit Flex an, fast in einem Raster (aber nicht ganz). Und ich brauche einige Ratschläge, um die Breite des letzten Elements anzupassen.export default function ShowChar(...) {
.....
return (

{(type=='h') && {hir}}
{(type=='k') && {kat}}

)
}
< /code>
Und dies ist der Code, der die obige Komponente verwendet. Er wird für jede Zeile einmal aufgerufen: < /p>
export default function ItemsRow(...) {
const [clasStr, setClasStr] = useState('');

useEffect(() => {
const sideLock = center ? 'around' : 'between'
setClasStr('flex flex-row justify-' + sideLock)
},

)
.....

return (

{
range.map((e:IteratedDataSnapshot) =>
handleCharClick(e)} >

)
}

)
} /* End of ItemsRow */
< /code>
Hier ist das CSS: < /p>
.char-card {
background-color: rgb(242, 230, 162);
border-color: rgb(10, 10, 212);
border-width: 3px;
border-radius: 0.5rem;
font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
font-size: xx-large;
padding-inline: 0.2rem;
margin: 0.5rem;
}
< /code>
Unten ist ein Screenshot des Ergebniss: < /p>

Ich möchte den letzten Knopf (d. H. Der unten), um die gesamte verfügbare Breite zu nehmen. Zeile oben. Dies ist nicht der Zweck dieser Frage.