Größe Variantenkapseln

Deutsch Diskussion Technische Fragen & Antworten
1

Hallo zusammen,

ich gestalten gerade meinen Onlineshop (Dawn-Theme) und habe eine Frage zu den Variantenkapseln auf der Produktseite.

Bei mir steht eine Größenauswahl von XS-XXL in der optischen Form von Kapseln zu Verfügung. Dabei rutscht bei der verwendeten Schriftart Helvetica leider die letzte Größe XXL in die zweite Reihe, obwohl ich es gerne einzeilig haben möchte.

Versucht habe ich bisher folgenden CSS Code, allerdings verändert sich ab 20px nichts mehr und es ist immer noch zweizeilig:

variant-selects {
font-size: 25px;
}

Gibt es eine Möglichkeit die Schriftgröße in den Kapseln noch zu verkleinern und dies über CSS zu lösen?

Vielen Dank im Voraus!

LG Jonas

2

@Yonaz Kannst du ein Screenshot zur Verfügung stellen?

3

IMG_4820.jpeg
IMG_4820.jpeg1179×577 31.9 KB

Kein Problem, vll bekommt man die untere Zeile mit dem Model ja auch einzeilig hin

4

@Yonaz du kannst in das Benutzerdefinierte CSS der Produktabschnitts Folgendes einsetzen:

.product-form__input--pill label{
  padding:.75rem 1.5rem;
}

Hierdurch werden die Pills etwas kleiner, wodurch sie in eine Reihe passen.

5

Danke, das hat schon mal super funktioniert! :slightly_smiling_face:

Da ja jeder Handybildschirm unterschiedlich groß ist, wollte ich noch fragen, ob es die Möglichkeit gibt die Breite automatisch an die Bildschirmbreite anzupassen?