<style media="all" type="text/css">.fond {background-image: url("https://i.imgbox.com/IjOQ579n.png"); width: 147px; height: 246px;  display: flex; flex-direction: column; justify-content: center; font-family: Arial;} .pseudo {color: #D3CFCF; margin-top: 5px; margin-bottom: -5px; font-size: 12px;} .bloc1 {position: relative; left: -5px;} .fond:hover .bloc2 {opacity: 1;} .bloc2{opacity: 0;  -webkit-transition: all 1s linear; -moz-transition: all 1s linear; -ms-transition: all 1s linear; -o-transition: all 1s linear; transition: all 1s linear; background-image: url("https://i.imgbox.com/CLIylCW2.jpg");  background-repeat: no-repeat; width: 100px; height: 120px; z-index: 2; position: absolute; margin-left: 18px; margin-top: -4px;} .heure {color: #949496; font-size: 8px; text-align: right; width: 94px; position: relative; top: -2px; opacity: 0.8;} .message{width: 77px; height: 52px; overflow: auto; text-align: justify; position: relative; top: 17px; color: #39383D; padding-right: 3px;} c {font-size: 7px; opacity: 0.3; color: #E0E0E0;} ::-webkit-scrollbar {width: 3px; height: 5px; background-color: transparent;} ::-webkit-scrollbar-track {background-color: transparent;} ::-webkit-scrollbar-thumb {background-color: black; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;}</style><center><div class="fond"><div class="bloc2"><div class="heure">00:00</div><center><div class="message">[size=10]<b>Pseudo :</b> Ici le contenu du message (pas en entier)[/size]</div></center></div><center><div class="bloc1"><img src="https://i.imgbox.com/KLtfFX7H.png" /><br /><div class="pseudo">Pseudo</div><span style="color: #1A9453; text-transform: uppercase; font-size: 9px;">Messages</span></div><c>© 4x4</c></center></div></center>