2025 Créer un site avec WordPress (Manu)
Manu
Hello, I am using Croccante theme, free version. For a page category (https://tapezetoile.fr/tapez-etoile/intervenants/), I don't understand the header ; it seems to take the image and title of the first post of the list ; is it normal ?
Thanks for your help
https://tapezetoile.fr/tapez-etoile/intervenants/
/* ------------------------------
Stabilisation du slider Croccante
------------------------------ */
.croccante-hero {
position: relative;
width: 100%;
height: 50vh; /* hauteur fixe sur desktop */
max-height: 600px; /* empêche le hero de devenir trop grand */
overflow: hidden;
}

.croccante-hero-img {
width: 100%;
height: 100%;
object-fit: cover; /* remplissage du bloc hero */
object-position: 50% 25%; /* point focal légèrement vers le haut */
}

/* Ajustement mobile */
@media (max-width:768px) {
.croccante-hero {
height: 40vh; /* hauteur réduite pour mobile */
min-height: 260px; /* limite minimale pour garder un rendu correct */
}

.croccante-hero-img {
object-position: 50% 20%; /* décale le point focal un peu plus haut pour mobile */
}
}
Si tu veux, copie‑colle ici une image de ton slider (ou l’URL d’une image qui pose problème), et je te donnerai la valeur exacte object-position à essayer pour que le sujet principal reste visible sur mobile.



RESPONSIVE

recréer 3 images slider en 1920×900

centrer les personnages : place le sujet dans la zone centrale haute

garder une zone vide sur les côtés

.croccante-hero-img{
object-fit:cover;
object-position:50% 25%;
}
@media (max-width:768px){

.croccante-hero-img{
object-position:50% 20%;
}

}


ou images supplémentaires spéciales mobile
1080 × 1440 px

centrer les personnages