Tuiles verticales
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
<div class="fr-grid-row fr-grid-row--gutters">
<div class="fr-col-6 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link" id="tile-6470">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link" id="tile-6471">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link" id="tile-6472">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link" id="tile-6473">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
</div>
Tuiles verticales
Titre M bold
Texte M regular 2 lignes max
Titre M bold
Texte M regular 2 lignes max
Titre M bold
Texte M regular 2 lignes max
Titre M bold
Texte M regular 2 lignes max
<div class="fr-grid-row fr-grid-row--gutters">
<div class="fr-col-6 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link" id="tile-6479">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link" id="tile-6480">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link" id="tile-6481">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link" id="tile-6482">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
</div>
Tuiles verticales
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
<div class="fr-grid-row fr-grid-row--gutters">
<div class="fr-col-6 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link" id="tile-6488">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link" id="tile-6489">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link" id="tile-6490">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link" id="tile-6491">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
</div>
</div>
</div>
Tuiles verticales
Titre M bold
Texte M regular 2 lignes max
Titre M bold
Texte M regular 2 lignes max
Titre M bold
Texte M regular 2 lignes max
Titre M bold
Texte M regular 2 lignes max
<div class="fr-grid-row fr-grid-row--gutters">
<div class="fr-col-6 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link" id="tile-6497">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link" id="tile-6498">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link" id="tile-6499">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link" id="tile-6500">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
</div>
</div>
</div>
Tuiles verticales accentuées
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
<div class="fr-grid-row fr-grid-row--gutters">
<div class="fr-col-6 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link fr-tile--grey" id="tile-6506">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link fr-tile--grey" id="tile-6507">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link fr-tile--grey" id="tile-6508">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link fr-tile--grey" id="tile-6509">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
</div>
Tuiles verticales, horizontales au dessus du breakpoint md
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
<div class="fr-grid-row fr-grid-row--gutters">
<div class="fr-col-12 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal fr-tile--vertical-md" id="tile-6515">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-12 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal fr-tile--vertical-md" id="tile-6516">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-12 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal fr-tile--vertical-md" id="tile-6517">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-12 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal fr-tile--vertical-md" id="tile-6518">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
</div>
Tuiles verticales, horizontales au dessus du breakpoint md
Titre M bold
Texte M regular 2 lignes max
Titre M bold
Texte M regular 2 lignes max
Titre M bold
Texte M regular 2 lignes max
Titre M bold
Texte M regular 2 lignes max
<div class="fr-grid-row fr-grid-row--gutters">
<div class="fr-col-12 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal fr-tile--vertical-md" id="tile-6524">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-12 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal fr-tile--vertical-md" id="tile-6525">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-12 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal fr-tile--vertical-md" id="tile-6526">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-12 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal fr-tile--vertical-md" id="tile-6527">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
</div>
Tuiles verticales, horizontales au dessus du breakpoint md
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
<div class="fr-grid-row fr-grid-row--gutters">
<div class="fr-col-12 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal fr-tile--vertical-md" id="tile-6533">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
</div>
</div>
<div class="fr-col-12 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal fr-tile--vertical-md" id="tile-6534">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
</div>
</div>
<div class="fr-col-12 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal fr-tile--vertical-md" id="tile-6535">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
</div>
</div>
<div class="fr-col-12 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal fr-tile--vertical-md" id="tile-6536">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
</div>
</div>
</div>
Tuiles verticales, horizontales au dessus du breakpoint md
Titre M bold
Texte M regular 2 lignes max
Titre M bold
Texte M regular 2 lignes max
Titre M bold
Texte M regular 2 lignes max
Titre M bold
Texte M regular 2 lignes max
<div class="fr-grid-row fr-grid-row--gutters">
<div class="fr-col-12 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal fr-tile--vertical-md" id="tile-6542">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
</div>
</div>
<div class="fr-col-12 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal fr-tile--vertical-md" id="tile-6543">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
</div>
</div>
<div class="fr-col-12 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal fr-tile--vertical-md" id="tile-6544">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
</div>
</div>
<div class="fr-col-12 fr-col-md-4 fr-col-lg-3">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal fr-tile--vertical-md" id="tile-6545">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
</div>
</div>
</div>
Tuiles horizontales
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
<div class="fr-grid-row fr-grid-row--gutters">
<div class="fr-col-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal" id="tile-6551">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal" id="tile-6552">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal" id="tile-6553">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal" id="tile-6554">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
</div>
Tuiles horizontales
Titre M bold
Texte M regular 2 lignes max
Titre M bold
Texte M regular 2 lignes max
Titre M bold
Texte M regular 2 lignes max
Titre M bold
Texte M regular 2 lignes max
<div class="fr-grid-row fr-grid-row--gutters">
<div class="fr-col-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal" id="tile-6560">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal" id="tile-6561">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal" id="tile-6562">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal" id="tile-6563">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
</div>
Tuiles horizontales
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
<div class="fr-grid-row fr-grid-row--gutters">
<div class="fr-col-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal" id="tile-6569">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
</div>
</div>
<div class="fr-col-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal" id="tile-6570">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
</div>
</div>
<div class="fr-col-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal" id="tile-6571">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
</div>
</div>
<div class="fr-col-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal" id="tile-6572">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
</div>
</div>
</div>
Tuiles horizontales
Titre M bold
Texte M regular 2 lignes max
Titre M bold
Texte M regular 2 lignes max
Titre M bold
Texte M regular 2 lignes max
Titre M bold
Texte M regular 2 lignes max
<div class="fr-grid-row fr-grid-row--gutters">
<div class="fr-col-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal" id="tile-6578">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
</div>
</div>
<div class="fr-col-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal" id="tile-6579">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
</div>
</div>
<div class="fr-col-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal" id="tile-6580">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
</div>
</div>
<div class="fr-col-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal" id="tile-6581">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
</div>
</div>
</div>
Tuiles horizontales, verticales au dessus du breakpoint md
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
<div class="fr-grid-row fr-grid-row--gutters">
<div class="fr-col-6 fr-col-md-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal-md" id="tile-6587">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal-md" id="tile-6588">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal-md" id="tile-6589">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal-md" id="tile-6590">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
</div>
Tuiles horizontales, verticales au dessus du breakpoint md
Titre M bold
Texte M regular 2 lignes max
Titre M bold
Texte M regular 2 lignes max
Titre M bold
Texte M regular 2 lignes max
Titre M bold
Texte M regular 2 lignes max
<div class="fr-grid-row fr-grid-row--gutters">
<div class="fr-col-6 fr-col-md-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal-md" id="tile-6596">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal-md" id="tile-6597">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal-md" id="tile-6598">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal-md" id="tile-6599">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
<div class="fr-tile__img">
<img class="fr-responsive-img" src="../../../example/img/placeholder.1x1.png" alt="" />
<!-- L’alternative de l’image (attribut alt) doit rester vide car l’image est illustrative et ne doit pas être restituée aux technologies d’assistance -->
</div>
</div>
</div>
</div>
Tuiles horizontales, verticales au dessus du breakpoint md
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
Titre M bold
Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dol
<div class="fr-grid-row fr-grid-row--gutters">
<div class="fr-col-6 fr-col-md-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal-md" id="tile-6605">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal-md" id="tile-6606">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal-md" id="tile-6607">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal-md" id="tile-6608">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Lorem [...] elit ut.</p>
</div>
</div>
</div>
</div>
Tuiles horizontales, verticales au dessus du breakpoint md
Titre M bold
Texte M regular 2 lignes max
Titre M bold
Texte M regular 2 lignes max
Titre M bold
Texte M regular 2 lignes max
Titre M bold
Texte M regular 2 lignes max
<div class="fr-grid-row fr-grid-row--gutters">
<div class="fr-col-6 fr-col-md-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal-md" id="tile-6614">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal-md" id="tile-6615">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal-md" id="tile-6616">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
</div>
</div>
<div class="fr-col-6 fr-col-md-12">
<div class="fr-tile fr-enlarge-link fr-tile--horizontal-md" id="tile-6617">
<div class="fr-tile__body">
<h3 class="fr-tile__title">
<a class="fr-tile__link" href="#">Titre M bold</a>
</h3>
<p class="fr-tile__desc">Texte M regular 2 lignes max</p>
</div>
</div>
</div>
</div>