Question à propos d'un code

Lun 23 Mai - 10:26
Bonjour Skaemp ! :-)

Voilà, je me suis servis en libre service d'un de vos codes de message/profil.
Voici le code en question (modifié en l'occurence) :
Code:
/*****AFFICHAGE PROFIL MESSAGE*****/
/* PRESENTATION DU SUJET */
/* TITRE MESSAGES */
.tleP {
text-align:left; font-size:10px; padding-left: 5px; border-left: 3px solid white;
padding-bottom: 5px; padding-top: 5px; height:20px; border-right: 5px solid white;
color:#808080; background-image: url('http://i68.tinypic.com/1566ddf.png'); /* MODIFIABLE */
}
 
/* PSEUDONYME */
.nameP {
width:10px; height:20px; padding:5px;
text-align:center; text-transform:uppercase; font-size: 12px;
border-bottom: 1px solid #efefef; border-left: 1px solid #efefef; border-top: 1px solid #efefef; /* MODIFIABLE */
}
/* CITER/EDITER/IP */
.toolsP {
width:10px; height:20px; padding:5px; text-align:center;
border: 1px solid #efefef; /* MODIFIABLE */
}
/* APPARENCE MESSAGES */
div.postbody {
padding:10px; width: 710px; height: 600px; margin-top:10px;
overflow: auto;
background: white; border: 1px solid #efefef; /* MODIFIABLE */
text-align:justify;
}
/* BLOC JOUEUR */
.tlP {
margin-left:10px; margin-top:7px; width:250px; text-align:center;
}
/* BLOC AVATAR */
#blocAVA {
width:250px; height:400px; margin:-5px; overflow:hidden;
}
.blocAVA {
position:relative; width:250px; height:400px; overflow:hidden;
}
/* AVATAR */
.avaP {
width:250px; height:400px;
transition:transform 0.75s linear; -webkit-transition:transform 0.75s linear;
}
#blocAVA:hover .avaP {
transform:translateX(250px); -webkit-transform:translateX(250px);
}
/* BLOC INFORMATIONS JOUEUR */
.dtailS {
position:absolute; margin-top:-400px;
padding:5px; width:240px; height:390px; overflow:auto;
background-image: url('http://i68.tinypic.com/1566ddf.png'); /* MODIFIABLE */
transform:translateX(-250px); -webkit-transform:translateX(-250px);
transition:transform 0.75s linear; -webkit-transition:transform 0.75s linear;
}
#blocAVA:hover .dtailS {
transform:translateX(0px); -webkit-transform:translateX(0px);
}
/* CONTENUS INFORMATIONS JOUEUR */
.dtailS div{
margin:5px auto;
width:200px;  padding:5px;
font-family:Arial; font-size:11px; text-align:justify; border: 1px solid #efefef;
color:#adadad; background:white; /* MODIFIABLE */
}
/* TITRES INFORMATIONS JOUEUR */
.dtailS div span{
text-transform:uppercase; color:#9777d5; /* MODIFIABLE */
}
/* BLOC IMAGE RANG/RANG/IMAGES CONTACT */
#rankP {
margin-top:10px; margin-left:-5px;
width:248px; height: 245px; padding-top:15px; overflow:hidden;
background:white; border: 1px solid #efefef; /* MODIFIABLE */
}
 
/* IMAGES CONTACT JOUEUR */
.ktactP {
position:relative; z-index:3; margin:auto; margin-bottom: 3px; margin-top:-5px; width:250px; text-align:center;}
 
/* IMAGE RANG */
.imgrankP img{
margin-top:5px; width:230px;
}
 
/****FIN AFFICHAGE PROFIL MESSAGE****/


Seulement, comme vous pouvez le voir sur le screen -> http://image.noelshack.com/fichiers/2016/20/1463847356-screen-shot-2016-05-21-at-18-15-14.png
l'image n'est pas automatiquement redimensionné et déborde du cadre. Vous pouvez vous faire une meilleure idée directement en regardant le profil -> http://zootopia.forumactif.org/t29-archibald-u-c#47
Auriez-vous une astuce afin que l'image se redimensionne automatiquement et ne déborde pas du cadre ?

En vous remerciant ! Like a Star @ heaven

PS : vous êtes dans les crédits ici http://zootopia.forumactif.org/t5-les-credits
Revenir en haut Aller en bas
Lun 23 Mai - 14:15
Bonsoir,

L'ajout des lignes suivantes à votre partie CSS devrait parer à ce souci esthétique :


Code:
/* IMAGES CONTENU INFORMATIONS JOUEUR */
.dtailS div img{
margin:auto; max-width:190px;
}
Revenir en haut Aller en bas
Lun 23 Mai - 15:10
Ça marche à la perfection !
Merci beaucoup Like a Star @ heaven Like a Star @ heaven Like a Star @ heaven

À bientôt et bonne continuation cat
Revenir en haut Aller en bas
Vous ne pouvez pas répondre aux sujets dans ce forum