Rappel du premier message :

Show me the meaning of being lonely

Voici une page d'accueil avec transition pour le staff.

Je précise que l'arrière plan gris correspond à mon forum.



Et le code :
HTML :

Code:

<div class="PA_fond"><div class="PA_titre02">Show me the meaning of being lonely ~</div><div class="PA_titre01">Contexte</div><div class="PA_contexte">Texte ici
</div><div class="PA_titre01">Staff</div><div class="PA_staff"><div class="PA_staff02"><div class="PA_staff03">Pseudo - Rang - Fonction</div><img src="LIEN DE L'IMAGE" /></div>

</div><div class="PA01"></div>
<br />
<div class="PA_titre01">What else ?</div><div class="PA_liens">Règlement<br />Contexte<br />Autres liens ~ 
</div><div class="PA_titre01">News</div><div class="PA_news">00/00/00 : Cras volutpat at elit non aliquam.<br />

</div><div class="PA01"></div>
<div class="PA_titre01">Prédéfinis</div><div class="PA_predef"><img src="LIEN DE L'IMAGE" />

</div>
<a href="http://www.never-utopia.com" id="PA_alice">A-Lice | Never-Utopia</a>
</div>

CSS :

Code:

.PA01 {
clear: both;
}

.PA_fond {
width: 680px;
height: 390px;
padding: 10px;
border-radius: 50px;
border: solid 2px #b07865;
margin: auto;
background: #f6d7cd;
color: #5B214F;
font-size: 12px;
}

.PA_titre01 {
text-indent: 70px;
font-size: 20px;
font-weight: bold;
color: #b73d44;
margin-top: -10px;
}

.PA_contexte {
float: left;
width: 270px;
height: 150px;
overflow: auto;
background: #b07865;
text-align: justify;
padding: 5px;
border-radius: 20px;
margin-right: 20px;
}

.PA_titre02 {
text-align: right;
font-size: 35px;
color: #d4457d;
text-shadow: 1px 1px 0px #b07865;
margin-top: -25px;
margin-left: 270px;
width: 400px;
}

.PA_staff {
width: 350px;
height: 140px;
background: #b07865;
text-align: justify;
padding: 5px;
float: right;
overflow: auto;
}

div.PA_staff02 {
width: 100px;
height: 70px;
overflow: hidden;
display: inline-block;
}

.PA_staff02 img {
width: 100px;
height: 70px;
position: relative;
bottom: 50px;
transition: 2s;
}

.PA_staff02:hover img {
bottom: 140px;
transition: 2s;
}

.PA_staff03 {
padding: 5px;
text-align: center;
}

.PA_liens {
float: left;
width: 270px;
height: 80px;
background: #b07865;
text-align: center;
padding: 5px;
}

.PA_news {
float: right;
width: 350px;
height: 100px;
background: #b07865;
text-align: justify;
padding: 5px;
border-radius: 20px;
}

.PA_predef {
width: 650px;
height: 50px;
padding: 5px;
margin: auto;
overflow: hidden;
}

#PA_alice {
text-decoration: none;
color: white;
font-size: 11px;
text-align: center;
display: block;
}

Remarque : Pour une utilisation optimale, la taille des images pour le staff est de 100px par 70px, pour les prédéfinis elle est de 50px par 50px.

Merci :)

super sympa merciiii

merci beaucoup

Merci :)

Merci !