Wie kann ich diesen Code responsive machen?

[Gunnar Bittersmann]

@@Enrico

Hallo,

ich habe im Internet ein einfahes Bewertungs-"Skript" gefunden, das aber leider fixe Maße hat:

.bewertung
{
   background:      url("data:image/svg+xml;...);
   background-size: contain;
   display:         inline-block;
   font-size:       0;
   height:          50px;
   overflow:        hidden;
   position:        relative;
   white-space:     nowrap;
   width:           250px
}

Dich stört die fixe Breite? Dann gibt sie doch in % an. Breiten von Nachfahrenelementen scheinen ja alle in % angegeben zu sein, sollten sich also entsprechend mitskalieren.

Damit die Box ihr Seitenverhältnis 5:1 behält, müsste die Höhe in Abhängigkeit von der Breite angegeben werden. Das könnte mit height: 0; paddig-top: 20% gelingen.

Ansonsten bitte Link zur Beispielseite/Codepen/Dabblet.

LLAP 🖖