Le Deal du moment : -25%
-25% Nike Air Max Genome – Chaussure pour Homme
Voir le deal
127.47 €

KoalaVolant
KoalaVolant
Disclaimer : Avant tout autre chose, je tiens à préciser que la maquette de ce code a été fait par Kaerin. Si vous mettez un crédit pour ce code, vous mettez aussi bien Kaerin que KoalaVolant.
Je signale aussi, qu'étant une personne non binaire, et même si je l'étais pas, puisque Kaerin est du même avis, nous ne cautionnons pas les propos de J.K Rowling. Mais ça ne change pas que le fandom appartient aussi aux fans, et que du coup on peut l'utiliser.
Mais vive les personnes trans et non binaires !



Explication



Cette fiche marche si vous avez quelque chose à dire sur Poudlard en général, ou sur une maison spécifique. Il y a un morceau pour chaque maison, à vous d'enlever dans le HTML ce qui ne sert pas Wink
PS : La typo est générique mais vous pouvez toujours la changer Very Happy

HTML



Code:
<div class="ficheadmvest"><h1>Gros titre</h1><div class="blocvest"><div class="vestdescri">Exorcizamus te, omnis immundus spiritus, omnis satanica potestas omnis incursio infernalis adversarii. Omnis legio! Omnis con...potestas, omnis incursio infernalis adversarii. Omnis legio! Omnis congregatio et secta diabolica! Ergo, Draco maledicte et omnis......legio diabolica, adiuramus te! Exorcizamus te, omnis immundus spiritus, omnis satanica potestas, omnis incursio infernalis adversarii. Omnis legio! Omnis congregatio et secta diabolica! Ergo, Draco maledicte et omnis legio diabolica, adiuramus te!

Exorcizamus te, omnis immundus spiritus, omnis satanica potestas omnis incursio infernalis adversarii. Omnis legio! Omnis con...potestas, omnis incursio infernalis adversarii. Omnis legio! Omnis congregatio et secta diabolica! Ergo, Draco maledicte et omnis......legio diabolica, adiuramus te! Exorcizamus te, omnis immundus spiritus, omnis satanica potestas, omnis incursio infernalis adversarii. Omnis legio! Omnis congregatio et secta diabolica! Ergo, Draco maledicte et omnis legio diabolica, adiuramus te!</div><div class="minitextvesti">Texte
<strong>XX - XX</strong></div></div><div class="blocvest gryffi"><div class="vestdescri">Exorcizamus te, omnis immundus spiritus, omnis satanica potestas omnis incursio infernalis adversarii. Omnis legio! Omnis con...potestas, omnis incursio infernalis adversarii. Omnis legio! Omnis congregatio et secta diabolica! Ergo, Draco maledicte et omnis......legio diabolica, adiuramus te! Exorcizamus te, omnis immundus spiritus, omnis satanica potestas, omnis incursio infernalis adversarii. Omnis legio! Omnis congregatio et secta diabolica! Ergo, Draco maledicte et omnis legio diabolica, adiuramus te!

Exorcizamus te, omnis immundus spiritus, omnis satanica potestas omnis incursio infernalis adversarii. Omnis legio! Omnis con...potestas, omnis incursio infernalis adversarii. Omnis legio! Omnis congregatio et secta diabolica! Ergo, Draco maledicte et omnis......legio diabolica, adiuramus te! Exorcizamus te, omnis immundus spiritus, omnis satanica potestas, omnis incursio infernalis adversarii. Omnis legio! Omnis congregatio et secta diabolica! Ergo, Draco maledicte et omnis legio diabolica, adiuramus te!</div><div class="minitextvesti">Texte
<strong>XX - XX</strong></div></div><div class="blocvest serdi"><div class="vestdescri">Exorcizamus te, omnis immundus spiritus, omnis satanica potestas omnis incursio infernalis adversarii. Omnis legio! Omnis con...potestas, omnis incursio infernalis adversarii. Omnis legio! Omnis congregatio et secta diabolica! Ergo, Draco maledicte et omnis......legio diabolica, adiuramus te! Exorcizamus te, omnis immundus spiritus, omnis satanica potestas, omnis incursio infernalis adversarii. Omnis legio! Omnis congregatio et secta diabolica! Ergo, Draco maledicte et omnis legio diabolica, adiuramus te!

Exorcizamus te, omnis immundus spiritus, omnis satanica potestas omnis incursio infernalis adversarii. Omnis legio! Omnis con...potestas, omnis incursio infernalis adversarii. Omnis legio! Omnis congregatio et secta diabolica! Ergo, Draco maledicte et omnis......legio diabolica, adiuramus te! Exorcizamus te, omnis immundus spiritus, omnis satanica potestas, omnis incursio infernalis adversarii. Omnis legio! Omnis congregatio et secta diabolica! Ergo, Draco maledicte et omnis legio diabolica, adiuramus te!</div><div class="minitextvesti">Texte
<strong>XX - XX</strong></div></div><div class="blocvest puffy"><div class="vestdescri">Exorcizamus te, omnis immundus spiritus, omnis satanica potestas omnis incursio infernalis adversarii. Omnis legio! Omnis con...potestas, omnis incursio infernalis adversarii. Omnis legio! Omnis congregatio et secta diabolica! Ergo, Draco maledicte et omnis......legio diabolica, adiuramus te! Exorcizamus te, omnis immundus spiritus, omnis satanica potestas, omnis incursio infernalis adversarii. Omnis legio! Omnis congregatio et secta diabolica! Ergo, Draco maledicte et omnis legio diabolica, adiuramus te!

Exorcizamus te, omnis immundus spiritus, omnis satanica potestas omnis incursio infernalis adversarii. Omnis legio! Omnis con...potestas, omnis incursio infernalis adversarii. Omnis legio! Omnis congregatio et secta diabolica! Ergo, Draco maledicte et omnis......legio diabolica, adiuramus te! Exorcizamus te, omnis immundus spiritus, omnis satanica potestas, omnis incursio infernalis adversarii. Omnis legio! Omnis congregatio et secta diabolica! Ergo, Draco maledicte et omnis legio diabolica, adiuramus te!</div><div class="minitextvesti">Texte
<strong>XX - XX</strong></div></div><div class="blocvest serpy"><div class="vestdescri">Exorcizamus te, omnis immundus spiritus, omnis satanica potestas omnis incursio infernalis adversarii. Omnis legio! Omnis con...potestas, omnis incursio infernalis adversarii. Omnis legio! Omnis congregatio et secta diabolica! Ergo, Draco maledicte et omnis......legio diabolica, adiuramus te! Exorcizamus te, omnis immundus spiritus, omnis satanica potestas, omnis incursio infernalis adversarii. Omnis legio! Omnis congregatio et secta diabolica! Ergo, Draco maledicte et omnis legio diabolica, adiuramus te!

Exorcizamus te, omnis immundus spiritus, omnis satanica potestas omnis incursio infernalis adversarii. Omnis legio! Omnis con...potestas, omnis incursio infernalis adversarii. Omnis legio! Omnis congregatio et secta diabolica! Ergo, Draco maledicte et omnis......legio diabolica, adiuramus te! Exorcizamus te, omnis immundus spiritus, omnis satanica potestas, omnis incursio infernalis adversarii. Omnis legio! Omnis congregatio et secta diabolica! Ergo, Draco maledicte et omnis legio diabolica, adiuramus te!</div><div class="minitextvesti">Texte
<strong>XX - XX</strong></div></div></div>

CSS



Code:
/* Fiche administration - Maquette Kaerin - Code KoalaVolant */

.ficheadmvest{ width:600px; margin:0 auto; font-family:Arial; }
.ficheadmvest *{ box-sizing:border-box; }

/* Structure du titre */

.ficheadmvest h1{ font-size:35px; text-align:center; text-transform:uppercase; padding:5px; width:100%; }

/* Bloc complet et ses variantes par maisons */

.blocvest{ width:600px; height:188px; margin:5px; background-size:cover; background-image:url('https://nsa40.casimages.com/img/2020/09/25/200925041347939885.png'); position:relative; overflow:hidden; }
.blocvest.gryffi{ background-image:url('https://nsa40.casimages.com/img/2020/09/25/200925041347860878.png'); }
.blocvest.serdi{ background-image:url('https://nsa40.casimages.com/img/2020/09/25/200925041348461759.png'); }
.blocvest.puffy{ background-image:url('https://nsa40.casimages.com/img/2020/09/25/200925041348201116.png'); }
.blocvest.serpy{ background-image:url('https://nsa40.casimages.com/img/2020/09/25/200925041348721582.png'); }
/* Les blasons des maisons */

.blocvest:before{ content:''; position:absolute; width:80px; height:132px;  top:12px;left:32px; }
.blocvest.gryffi:before{ background-image:url('https://nsa40.casimages.com/img/2020/09/24/20092405305976847.png'); }
.blocvest.serdi:before{ background-image:url('https://nsa40.casimages.com/img/2020/09/24/200924053059393355.png'); }
.blocvest.puffy:before{ background-image:url('https://nsa40.casimages.com/img/2020/09/24/200924053059141191.png'); }
.blocvest.serpy:before{ background-image:url('https://nsa40.casimages.com/img/2020/09/24/200924053059670533.png'); }

/* Les blocs de texte géant */

.vestdescri{ position:absolute; right:10px; top:16px;  width:417px; height:123px; overflow:auto;
  padding:15px; background-color:rgb(255, 255, 255, 0.80); color:#000; }
.blocvest.gryffi .vestdescri{ background-color:rgb(111, 38, 45, 0.8); color:#fff; }
.blocvest.serdi .vestdescri{ background-color:rgb(93, 143, 192, 0.8); color:#fff; }
.blocvest.puffy .vestdescri{ background-color:rgb(255, 196, 43, 0.8); color:#000; }
.blocvest.serpy .vestdescri{ background-color:rgb(25, 77, 50, 0.8); color:#fff; }

/* Le petit bloc noir pour chacun */

.minitextvesti{ background-color:#000; color:#fff; font-size:12px; line-height:12px; text-transform:uppercase; text-align:center; width:100%; padding:5px; position:absolute; bottom:0; }
Revenir en haut

Partenaires footer

RPG-Chevalier Logo WyvArtem Image hébergée gratuitement chez Image hébergée gratuitement chez