convert content to md

1 files changed, 22 insertions, 55 deletions

diff --git a/files/fr/web/progressive_web_apps/responsive/responsive_design_building_blocks/index.md b/files/fr/web/progressive_web_apps/responsive/responsive_design_building_blocks/index.md
index 0e809a6294..47d2522dff 100644
--- a/files/fr/web/progressive_web_apps/responsive/responsive_design_building_blocks/index.md
+++ b/files/fr/web/progressive_web_apps/responsive/responsive_design_building_blocks/index.md
@@ -11,66 +11,33 @@ translation_of: Web/Progressive_web_apps/Responsive/responsive_design_building_b
 translation_of_original: Web/Progressive_web_apps/Responsive
 original_slug: Web/Progressive_web_apps/Adaptative
 ---
+Les applications web adaptatives utilisent des technologies comme les media queries et viewport pour être sûre que leur interface convient avec tout les facteurs de forme: bureau, téléphone, tablette, ou peut importe ce qui viendra après.
 
-<p>Les applications web adaptatives utilisent des technologies comme les media queries et viewport pour être sûre que leur interface convient avec tout les facteurs de forme: bureau, téléphone, tablette, ou peut importe ce qui viendra après.</p>
+## Guides
 
-<h2 id="Guides">Guides</h2>
+- [Les fondations du design adaptatif](/fr/Apps/app_layout/responsive_design_building_blocks)
+  - : Apprendre les bases du design adaptatif, un sujet essentiel pour l'affichage des applications web modernes.
+- [Mobile avant tout (_Mobile first_)](/fr/docs/Web/Apps/Modern/Responsive/Mobile_first)
+  - : Souvent lors de la création de l'affichage d'une application adaptative, il est judicieux de créer en premier le rendu sur téléphone mobile, et d'utiliser ce rendu comme base pour concevoir les écrans plus larges.
 
-<dl>
- <dt><a href="/fr/Apps/app_layout/responsive_design_building_blocks">Les fondations du design adaptatif</a></dt>
- <dd>Apprendre les bases du design adaptatif, un sujet essentiel pour l'affichage des applications web modernes.</dd>
- <dt><a href="/fr/docs/Web/Apps/Modern/Responsive/Mobile_first">Mobile avant tout (<em>Mobile first</em>)</a></dt>
- <dd>Souvent lors de la création de l'affichage d'une application adaptative, il est judicieux de créer en premier le rendu sur téléphone mobile, et d'utiliser ce rendu comme base pour concevoir les écrans plus larges.</dd>
-</dl>
+## Technologies
 
-<h2 id="Technologies">Technologies</h2>
+| Technologie                                                                                            | Description                                                                                                                                                                       | Résumé du support                                                                                                                                             | Dernière spécification                                                                                 |
+| ------------------------------------------------------------------------------------------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------ |
+| [Media queries](/fr/docs/Web/CSS/Media_Queries)                                                        | Permet de définir des conditions permettant aux styles d'être appliqués aux contenus en fonction de l'affichage disponible (_viewport_), de la résolution, de l'orientation, etc. | Répandu sur les navigateurs modernes ([plus de détails](/fr/docs/Web/CSS/Media_Queries#Browser_compatibility))                                                | [Media Queries Level 4](https://drafts.csswg.org/mediaqueries-4/)                                      |
+| [@viewport](/fr/docs/Web/CSS/@viewport)/[viewport meta tag](/fr/docs/Mozilla/Mobile/Viewport_meta_tag) | Contrôler la configuration du _viewport_, principalement sur les appareils mobiles.                                                                                               | @viewport: Expérimental ([plus de détails](/fr/docs/Web/CSS/@viewport#Browser_compatibility)) _Viewport meta tag_: Répandu sur les appareils mobiles modernes | [CSS Device Adaptation Module Level 1](https://drafts.csswg.org/css-device-adapt/#the-atviewport-rule) |
+| [Flexbox](/fr/docs/Web/CSS/CSS_Flexible_Box_Layout)                                                    | Une fonctionnalité CSS très utile pour créer une mise en page flexible et adaptative.                                                                                             | Répandu sur les navigateurs modernes ([plus de détail](/fr/docs/Web/CSS/CSS_Flexible_Box_Layout#Browser_compatibility))                                       | [CSS Flexible Box Layout Module Level 1](https://drafts.csswg.org/css-flexbox-1/)                      |
 
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Technologie</th>
-   <th scope="col">Description</th>
-   <th scope="col">Résumé du support</th>
-   <th scope="col">Dernière spécification</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td><a href="/fr/docs/Web/CSS/Media_Queries">Media queries</a></td>
-   <td>Permet de définir des conditions permettant aux styles d'être appliqués aux contenus en fonction de l'affichage disponible (<em>viewport</em>), de la résolution, de l'orientation, etc.</td>
-   <td>Répandu sur les navigateurs modernes (<a href="/fr/docs/Web/CSS/Media_Queries#Browser_compatibility">plus de détails</a>)</td>
-   <td><a href="https://drafts.csswg.org/mediaqueries-4/">Media Queries Level 4</a></td>
-  </tr>
-  <tr>
-   <td><a href="/fr/docs/Web/CSS/@viewport">@viewport</a>/<a href="/fr/docs/Mozilla/Mobile/Viewport_meta_tag">viewport meta tag</a></td>
-   <td>Contrôler la configuration du <em>viewport</em>, principalement sur les appareils mobiles.</td>
-   <td>@viewport: Expérimental (<a href="/fr/docs/Web/CSS/@viewport#Browser_compatibility">plus de détails</a>)<br>
-    <em>Viewport meta tag</em>: Répandu sur les appareils mobiles modernes</td>
-   <td><a href="https://drafts.csswg.org/css-device-adapt/#the-atviewport-rule">CSS Device Adaptation Module Level 1</a></td>
-  </tr>
-  <tr>
-   <td><a href="/fr/docs/Web/CSS/CSS_Flexible_Box_Layout">Flexbox</a></td>
-   <td>Une fonctionnalité CSS très utile pour créer une mise en page flexible et adaptative.</td>
-   <td>Répandu sur les navigateurs modernes (<a href="/fr/docs/Web/CSS/CSS_Flexible_Box_Layout#Browser_compatibility">plus de détail</a>)</td>
-   <td><a href="https://drafts.csswg.org/css-flexbox-1/">CSS Flexible Box Layout Module Level 1</a></td>
-  </tr>
- </tbody>
-</table>
+## Outils
 
-<h2 id="Outils">Outils</h2>
+- [Modernizr](https://modernizr.com/)
+  - : Une bibliothèque d'outils de détection des fonctionnalités pour appliquer différents CSS ou JS en fonctions de comment les différentes fonctionnalités CSS/JS sont supportées.
+- [css3-mediaqueries-js](https://code.google.com/archive/p/css3-mediaqueries-js/)
+  - : Un _polyfill_ en JavaScript pour assurer le support de _media query_ aux anciennes versions de IE (5+.)
 
-<dl>
- <dt><a class="external" href="https://modernizr.com/">Modernizr</a></dt>
- <dd>Une bibliothèque d'outils de détection des fonctionnalités pour appliquer différents CSS ou JS en fonctions de comment les différentes fonctionnalités CSS/JS sont supportées.</dd>
- <dt><a class="external" href="https://code.google.com/archive/p/css3-mediaqueries-js/">css3-mediaqueries-js</a></dt>
- <dd>Un <em>polyfill</em> en JavaScript pour assurer le support de <em>media query</em> aux anciennes versions de IE (5+.)</dd>
-</dl>
+## Voir aussi
 
-<h2 id="Voir_aussi">Voir aussi</h2>
-
-<dl>
- <dt><a href="/fr/Apps/Design/Design_graphique_pour_les_sites_responsiveGraphics_for_responsive_sites">Graphiques dans les sites adaptatifs</a></dt>
- <dd>Points à garder à l'esprit lors de la conception de graphiques pour des sites ou des applications adaptatives.</dd>
- <dt><a href="/fr/Apps/Design/Patrons_navigation_adaptative">Modèle de navigation adaptative</a></dt>
- <dd>Comment faire une interface aussi ressemblante et fonctionnelle sur téléphone mobile que sur bureau? Apprenez comment concevoir des interfaces qui changent pour s'adapter à l'écran de l'utilisateur.</dd>
-</dl>
+- [Graphiques dans les sites adaptatifs](/fr/Apps/Design/Design_graphique_pour_les_sites_responsiveGraphics_for_responsive_sites)
+  - : Points à garder à l'esprit lors de la conception de graphiques pour des sites ou des applications adaptatives.
+- [Modèle de navigation adaptative](/fr/Apps/Design/Patrons_navigation_adaptative)
+  - : Comment faire une interface aussi ressemblante et fonctionnelle sur téléphone mobile que sur bureau? Apprenez comment concevoir des interfaces qui changent pour s'adapter à l'écran de l'utilisateur.