CaptainFantastic
Grünschnabel
Hi Leute,
bin gerade dabei eine Galerieübersicht zu bauen.
Nun möchte ich das div mit der Klasse "work-wrapper" einsparen und stattdessen dem article diese Klasse mitgeben.
Mein Problem das ich jetzt habe ist die erste Überschrift <h5> die auch ein grid wird.
Nun habe ich überlegt die pseudo-classe :not() für die Überschrift zu verwenden und da mangelt es mir an Ideen wie ich das nun mache.
Ansatzweise mit: .work-wrapper:not::first-child {} ?
Könnt ihr mir da helfen? Ich möchte nur die nötigsten tags nutzen und das div kann man sicherlich einsparen.
Danke für eure Hilfe.
C.F.
bin gerade dabei eine Galerieübersicht zu bauen.
HTML:
<article id="" class="">
<h5>Work - Overview</h5>
<div class="work-wrapper">
<section class="card">
<a class="" href=" ">
<h4 class="header-tabelle">
Titel DEMOBILD 1
</h4>
<figure class="img-wrapper">
<img src="" alt="IMG">
</figure>
</a>
<p>
SUBTEXT 1
<span>SUBTEXT 2</span>
</p>
</section>
<section>
[...]
</section>
[...]
CSS:
.work-wrapper {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
grid-gap: 10px;
color: #444;
margin-bottom: 2em;
}
.card {
background-color: #fff;
color: #111;
border-radius: 20px;
padding: 2px;
}
Nun möchte ich das div mit der Klasse "work-wrapper" einsparen und stattdessen dem article diese Klasse mitgeben.
Mein Problem das ich jetzt habe ist die erste Überschrift <h5> die auch ein grid wird.
Nun habe ich überlegt die pseudo-classe :not() für die Überschrift zu verwenden und da mangelt es mir an Ideen wie ich das nun mache.
Ansatzweise mit: .work-wrapper:not::first-child {} ?
Könnt ihr mir da helfen? Ich möchte nur die nötigsten tags nutzen und das div kann man sicherlich einsparen.
Danke für eure Hilfe.
C.F.
Zuletzt bearbeitet: