Änderung Ansicht Preis

Hallo Zusammen,

ich habe eine Frage bezüglich der Ansicht unseres Satzes “(Du sparst XY€)”. Siehe Bilder :backhand_index_pointing_down:

Sowohl in der Mobilen, als auch in der Desktop Ansicht verschiebt sich der Satz ganz komisch und nimmt viel von Platz weg. Wie schaffe ich es, dass mir der Satz der Ersparnis in einer Zeile angezeigt wird?

Unsere Webseite ist: https://www.nextcover.de/

Vielen Dank für eure Unterstützung!

Liebe Grüße

Simon

@simon_h_1 in den CSS-Einstellungen der Bewertungsapp gibt es folgende Klasse:

.lord-parent {
    display: flex;
    gap: 50%;
}

Hierbei ist das gap-Attribut dafür verantwortlich, dass die Bewertungen ganz rechts stehen. Wenn du das in bspw. “15px” änderst, rückt die Bewertung näher an den Preis.

.lord-parent {
    display: flex;
    gap: 15px;
}

Hallo Finder,

danke für deine schnelle Antwort! Du hast recht, wenn ich den Abstand verringere, dann wird die Ersparnis wieder in einer Zeile angezeigt. Das sieht dann auf der Mobile Ansicht gut aus, aber auf der Desktop Ansicht sehen die Sterne-Bewertungen, dann irgendwie deplatziert aus.

Gibt es eine Möglichkeit, wie man die Sterne Bewertungen ganz rechts stehen haben kann und den Satz mit der Ersparnis trotzdem zusammen in einer Zeile drunter?

@simon_h_1 ja du kannst statt dem “gap” auch was anderes (justify-content) verwenden:

.lord-parent {
    display: flex;
    justify-content: space-between;
}
1 Like

Jawoll, so hat es geklappt! Vielen Dank.