Bonjour,

J'essaie de mettre en place un diaporama sur mon site mais je me heurte à des problèmes de cadrage des images.

Les photos dont je dispose proviennes de plusieurs source et sont au format : 1024 x 576, 1024 x 768, 1024 x 683

Les images sont redimensionnées en 576 x 324. Pour certaines j'ai forcé le format en ne respectant pas le rapport hauteur largeur pour avoir le même format.

ci-dessous le code css

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
 
.diaporama2
{
	position:absolute;
	margin-top: 70px;
	width:750px;
	height: 422px;
 
	margin-left: 200px;
	margin-right: 10 auto;
	border: 3px solid #333;
	background-size: contain;
 	webkit-animation-name: diapo1;
	webkit-animation-duration: 9s;
	webkit-animation-timing-function: linear;
	webkit-animation-iteration-count: infinite;
	webkit-animation-direction: normal;
Les images recadrées sans respecter le rapport largueur-hauteur s'affiche en entier plus le début pour compléter le cadre, les autres s'affichent correctement.

Je ne sais pas comment résoudre ce problème,

Merci de votre aide,

Cordialement