20.933
Bearbeitungen
RaWen (Diskussion | Beiträge) (Test GPT4.0 Grid-System) |
RaWen (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
||
Zeile 11: | Zeile 11: | ||
padding: 1.4em;} | padding: 1.4em;} | ||
/* | /* Container für Logo und Bild mit Grid-Layout */ | ||
.infobox .logo-bild-container { | .infobox .logo-bild-container { | ||
display: grid; | display: grid; | ||
width: 100%; /* Container nimmt volle Breite ein */ | |||
position: relative; /* Für | position: relative; /* Für die absolute Positionierung des Logos */ | ||
} | } | ||
/* Logo | /* Stil für das Logo */ | ||
.infobox .logo { | .infobox .logo { | ||
position: absolute; /* Absolute Positionierung innerhalb des Grid-Containers */ | |||
top: 0; /* Logo am oberen Rand des Containers */ | |||
width: 100%; /* Logo nimmt volle Breite ein, passt sich aber der Höhe des Inhalts an */ | |||
z-index: 2; /* Stellt sicher, dass das Logo über dem Bild liegt */ | z-index: 2; /* Stellt sicher, dass das Logo über dem Bild liegt */ | ||
/* Behalten Sie die | /* Behalten Sie weitere Stile bei, die für das Logo erforderlich sind */ | ||
} | } | ||
/* Bild- | /* Bild-Container */ | ||
.infobox .bild { | .infobox .bild { | ||
grid-row: 1 / | grid-row: 1; /* Bild im ersten Grid-Bereich */ | ||
/* | width: 100%; /* Bild-Container nimmt volle Breite ein */ | ||
/* Behalten Sie weitere Stile bei, die für den Bild-Container erforderlich sind */ | |||
} | } | ||
.bild img { | |||
width: 100% | width: 100%; /* Bild nimmt volle Breite des Containers ein */ | ||
height: auto; /* Höhe passt sich dem Seitenverhältnis des Bildes an */ | |||
/* Behalten Sie weitere Stile bei, die für das Bild erforderlich sind */ | |||
/* | |||
} | } | ||
/* Aspekt-Gruppen */ | |||
.infobox .aspect-group{ | .infobox .aspect-group{ |