28133 sujets

CSS et mise en forme, CSS3

Bonjour
Je ne suis pas arrivé à réaliser
J'ai un encadré en css qui fonctionne bien sur l'élément .encadre

J'ai voulu faire la même chose sur la liste des films en lien avec cet auteur en dupliquant le code css sur l'élément .film-presentation
Le code ci-dessous fonctionne bien, j'arrive bien à pointer sur cet élément

.film-presentation{
  border:2px dotted black;
  background: lightyellow;
  }

par contre, aucune reproduction de l'effet sur la liste (cf image)
Le code ne doit pas fonctionner mais je ne sais pas ce qui manque.

cerise sur le gâteau si je pouvais ajouter un titre "Liste des films" dans le tiret de l'encadre (mais bon peut-être aussi impossible) ?

/* encadré liste lié aux pro */
.film-presentation{ 
	position: relative;
}
 .film-presentation::after{
	content: "";
	display: block;
	position: absolute;
	left: 0;
	right: 0;
	bottom: -0.5rem;
	height: 0.5rem;
	width:100%;
	background-image: radial-gradient(farthest-side at top center, #777, #888, #fff);
	background-size: 100%;
	background-position: top;
	background-repeat: no-repeat;	
}
.film-presentation>div{
	border-radius: 10px;
	border: 1px solid var(--cassiopeia-color-secondary);
	overflow: hidden;
	color: #444;
	background: #fff;
	padding:1em;	
}

upload/1716449120-58614-alterwebencadre-film.png
Non, non. Pour avoir eu la malchance de vous avoir lu HDCMS dans vos autres "avatars" Je vous souhaite une Quête de sens hors de ces murs. Laissez nous tranquille.

Modération :
Attention ! Le troll n'est pas permis ici ! Encore une réflexion de ce genre et au revoir !
Modifié par niuxe (25 May 2024 - 17:05)
Bonjour
2lwess a écrit :
Non, non. Pour avoir eu la malchance de vous avoir lu HDCMS dans vos autres "avatars" Je vous souhaite une Quête de sens hors de ces murs. Laissez nous tranquille.

Modération :
Attention ! Le troll n'est pas permis ici ! Encore une réflexion de ce genre et au revoir !

C'est qui cette "personne" Smiley eek si c'est une qui n'aime pas le site !? ou un robot
En tout les cas, je ne reçois plus que ce genre de message maintenant Smiley rolleyes
Est-ce que j'ai mal formulé ou que ce site dérange ?
Salut,

je suis pas sur de comprendre ce que tu cherches à faire.
Si tu as une classe "encadre" qui fait ce que tu veux, pourquoi tu modifies la classe "film-presentation" ?

Si ta classe encadre fais le job, tu l'appliques directement aux éléments que tu veux et c'est tout.
En évitant de dupliquer le code (en changeant juste le nom de la classe de ce que j'en comprends), tu pourras faire des MAJ plus facilement en modifiant directement le code de la classe et que cela s'applique partout directement.

Petit édit pour la partie "cerise sur le gâteau" : je crois que c'est un truc comme ça que tu as besoin : https://css-tricks.com/how-to-add-text-in-borders-using-basic-html-elements/ (donc combo fieldset et legend)
Modifié par Mathieuu (29 May 2024 - 16:19)
Bonjour
Merci pour la suggestion.
En dupliquant la chose mais le code HTML n'est pas du tout le même et je ne peux intervenir sur le code. Il faudrait que le dev' qui fait l'extension modifie son code.
Peu probable. après pas mal de recherche, je laisse tomber pour l'instant