Codage fiche de lien

<link href="https://fonts.googleapis.com/css2?family=Saira&display=swap" rel="stylesheet">
<center>
<div style="width:480px;padding:8px;background:#353535;color:#818181"><center><img src="https://imagesvc.meredithcorp.io/v3/mm/gif?url=https%3A%2F%2Fstatic.onecms.io%2Fwp-content%2Fuploads%2Fsites%2F12%2F2016%2F05%2Fwe-re-friend-gif.gif" style="width:470px;height:200px;border:solid 2px #008996"/>
  
<div class="flientitre">Prénom Prénom² Nom</div></center><table style="margin-top:2px"><td style="background:#EEE;width:200px;height:320px;"><div class="avatarlien"><div style="width: 200px; height: 320px; background-image: url('https://zupimages.net/up/20/22/5kkt.png');"><div class="flien"><div class="flienhistoire">Histoire/chronologie</div>Procedente igitur mox tempore cum adventicium nihil inveniretur, relicta ora maritima in Lycaoniam adnexam Isauriae se contulerunt ibique densis intersaepientes itinera praetenturis provincialium et viatorum opibus pascebantur. Montius nos tumore inusitato quodam et novo ut rebellis et maiestati recalcitrantes Augustae per haec quae strepit incusat iratus nimirum quod contumacem praefectum, quid rerum ordo postulat ignorare dissimulantem formidine tenus iusserim custodiri. Hac ita persuasione reducti intra moenia bellatores obseratis undique portarum aditibus, propugnaculis insistebant et pinnis, congesta undique saxa telaque habentes in promptu, ut si quis se proripuisset interius, multitudine missilium sterneretur et lapidum.</div></div></div></td><td><div style="background:#353535;width:249px;height:320px;overflow:auto; padding:5px;color:white;"><div class="flieninfo">Identité</div>▷ Surnom :
▷ Date de naissance/Âge :
▷ Nationalité :
▷ Famille :
▷ Orientation :
▷ Statut :
▷ Emploi :
▷ Groupe :
<div class="flieninfo">Apparence</div>
▷ Taille :
▷ Poids :
▷ Couleur des cheveux :
▷ Couleurs des yeux :
▷ Tatouage, cicatrices, tâches ou grain de beauté particuliers :
▷ Avatar :
<div class="flieninfo">Caractéristiques</div>
▷ Caractère :
▷ Langues parlées :
▷ Aspiration :
▷ Goûts :
▷ Peur :
▷ Crédit images :
▷ Informations marquantes :</div></td></table><div class="flientitre">Liens recherchés</div><div class="fliensearch">(♂/♀) Nom du lien ► Description ...
(♂/♀) Nom du lien ► Description ...
(♂/♀) Nom du lien ► Description ...
(♂/♀) Nom du lien ► Description ...
(♂/♀) Nom du lien ► Description ...
(♂/♀) Nom du lien ► Description ...
(♂/♀) Nom du lien ► Description ...
(♂/♀) Nom du lien ► Description ...
(♂/♀) Nom du lien ► Description ...
(♂/♀) Nom du lien ► Description ...</div>
</div></center>

<div class="fond_titre_a" style="background-image:url(https://media1.tenor.com/images/4da7625141b5cfb293fadd994e3554f5/tenor.gif?itemid=4670467);"><div class="fond_text"><div class="titres">Liens</div></div></div><div class="fond_text_annexe"><div class="text_annexe"><div class="Bloc_RP"><h3>lien 1 </h3><img src="https://zupimages.net/up/20/29/quik.png" align="left"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec eget congue mauris. Sed nec risus in sem rhoncus ullamcorper. Nullam feugiat bibendum felis et scelerisque. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nunc nec leo laoreet, pretium mauris non, commodo quam. Nulla suscipit gravida leo id varius. Sed molestie feugiat finibus. Sed iaculis enim erat, scelerisque auctor urna aliquam at. In aliquet augue eget augue porttitor, auctor vulputate lacus consequat. Quisque at molestie massa, in tincidunt ligula. </p></div>

<div class="Bloc_RP"><h3>Lien 2</h3><img src="https://zupimages.net/up/20/29/quik.png" align="right"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec eget congue mauris. Sed nec risus in sem rhoncus ullamcorper. Nullam feugiat bibendum felis et scelerisque. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nunc nec leo laoreet, pretium mauris non, commodo quam. Nulla suscipit gravida leo id varius. Sed molestie feugiat finibus. Sed iaculis enim erat, scelerisque auctor urna aliquam at. In aliquet augue eget augue porttitor, auctor vulputate lacus consequat. Quisque at molestie massa, in tincidunt ligula.
</p></div>
<div class="Bloc_RP"><h3>Lien 3</h3><img src="https://zupimages.net/up/20/29/quik.png" align="left"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec eget congue mauris. Sed nec risus in sem rhoncus ullamcorper. Nullam feugiat bibendum felis et scelerisque. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nunc nec leo laoreet, pretium mauris non, commodo quam. Nulla suscipit gravida leo id varius. Sed molestie feugiat finibus. Sed iaculis enim erat, scelerisque auctor urna aliquam at. In aliquet augue eget augue porttitor, auctor vulputate lacus consequat. Quisque at molestie massa, in tincidunt ligula.
</p></div>

<div class="Bloc_RP"><h3>Lien 4
</h3><img src="https://zupimages.net/up/20/29/quik.png" align="right"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec eget congue mauris. Sed nec risus in sem rhoncus ullamcorper. Nullam feugiat bibendum felis et scelerisque. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nunc nec leo laoreet, pretium mauris non, commodo quam. Nulla suscipit gravida leo id varius. Sed molestie feugiat finibus. Sed iaculis enim erat, scelerisque auctor urna aliquam at. In aliquet augue eget augue porttitor, auctor vulputate lacus consequat. Quisque at molestie massa, in tincidunt ligula.</p></div>
</div></div>