- Crédit à KoalaVolant
- La fiche fait 700px de largeur mais peut être modifiée ça devrait normalement s'adapter.

Code:

<div class="wikiki">
<img src="https://i.imgur.com/55FhLH9.jpg" class="wikiki_1screen">
<!-- Nom Prénom Titre -->
<span class="wikiki_nomprenom1">Nom Prénom</span>
<img src="https://i.imgur.com/q2aJ6MA.jpg" class="wikiki_2screen">
<div class="wikiki-flex">
<!-- Zone texte avec titre inclus-->
<div class="wikiki_zonetexte">
<div class="wikiki_texte"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vitae efficitur ante. Etiam faucibus mollis mauris sit amet pharetra. Aenean sapien sapien, gravida tincidunt cursus sed, vehicula a quam. Fusce pretium lobortis condimentum. Maecenas sed lorem sem. Aliquam maximus augue eu diam suscipit, lacinia pellentesque elit molestie. Suspendisse convallis sapien imperdiet, facilisis eros non, fringilla augue. In hac habitasse platea dictumst. Vestibulum pulvinar sapien vitae leo pharetra tempor.

Integer lacinia mattis egestas. Morbi rutrum libero nec vehicula tempor. Cras elementum ultricies metus, a sagittis ante finibus eu. Quisque ut ullamcorper nisl, et lacinia lectus. Phasellus metus nisi, placerat vel nulla eu, hendrerit elementum enim. Sed dictum lorem tellus, dignissim ullamcorper est ornare vitae. Nulla sed lobortis lacus, id fermentum erat. Etiam vitae ante consequat, consectetur neque non, finibus orci. Curabitur facilisis diam quis felis cursus, vitae mattis quam ultricies. In dapibus lorem vel elit vestibulum rutrum. Quisque interdum ornare sapien. Maecenas mollis massa in fringilla efficitur. Donec non risus in orci faucibus iaculis. Proin tempor pretium finibus. Sed facilisis enim nulla. Praesent massa felis, consequat vel venenatis ac, sodales non erat.
</div>
<!-- Titre exemple -->
<div class="wikiki_titre">Biographie</div>
</div>
<!-- Zone infos -->
<div class="wikiki_infos">
<!-- Titre Nom prénom -->
<div class="wiki_nomprenom2">Nom Prénom</div>
<!-- Avatar / Image -->
<img src="https://www.zupimages.net/up/23/40/s99k.jpg" class="wiki_avatar">
<span class="wiki_legend">Une légende pour l'avatar</span>
<!-- Exemple de titre -->
<div class="wiki_sstitre">Fonctions</div>
<!-- Exemple de texte uniquement -->
<span class="wiki_textonly">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent vitae efficitur ante. Etiam faucibus mollis mauris sit amet pharetra. Aenean sapien sapien</span>
<!-- Exemple de titre -->
<div class="wiki_sstitre">Fonctions</div>
<!-- Exemple de texte avec définition à droite -->
<div class="wiki_textblabla">
<span>Naissance</span>
<div>06 septembre 1994</div>
</div>
<!-- Fin de la partie de droite et de la fiche wiki -->
</div></div></div>

Il y a des commentaires pour vous guider mais si jamais :
Si vous avez besoin du titre, il suffira de copier

Code:

<div class="wikiki_titre">Biographie</div>

Si vous avez besoin de sous titre à droite :

Code:

<div class="wiki_sstitre">Fonctions</div>

Si vous avez besoin d'information à droite :

Code:

<div class="wiki_textblabla">
<span>Naissance</span>
<div>06 septembre 1994</div>
</div>

Code:

.wikiki{ background:#fff; width:700px; color:#000; padding:15px;}
.wikiki br{ display:none; }
.wikiki, .wikiki *{ box-sizing:border-box;}

.wikiki_1screen{ margin-top:10px;}
.wikiki_nomprenom1{ border-bottom:1px solid #c8c8c8; padding-bottom:5px; font-family:sans serif; display:block; margin:10px 0px; font-size:23px; }

.wikiki-flex{ display:flex; justify-content:space-between;  margin:10px 0; font-family:Arial; }
.wikiki_zonetexte{ width:64%;  }
.wikiki_infos{ width:34%; font-size:12px; float:right; border:1px solid #c7c9cf; padding:5px; background: #F9F9F9;}
.wikiki .wikiki_texte br{
  content: " ";
  display:  inline-block;
  line-height:11px !important; }

.wikiki_titre{ font-family:sans serif; font-size:18px;
 padding-bottom:5px; margin:8px 0;border-bottom:1px solid #8e9cc4; }


.wiki_nomprenom2{ background:#4C6099; text-align:center;
 padding:5px; color:white; font-weight:600; }
.wiki_avatar{ margin:7px 0 5px; height:200px; width:100%; object-fit:cover;  }
.wiki_legend{ font-size:10px; width:100%; display:block; text-align:center; }

.wiki_sstitre{ background:#4c6099; text-align:center;
 color:#fff; font-weight:600;  margin:5px 0; }

.wiki_textblabla{ display:flex;}
.wiki_textblabla span{ font-weight:600; width:30%; }
.wiki_textblabla div{ width:67%; margin-left:10px;  }