Bonjour,

Les deux fichiers ci-dessous sont placés dans un même dossier.
Fichier page.html
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <style>
      body { 
        background-color: #ff9; 
        padding: 20px; 
      }
    </style>
  </head>
  <body>Un texte...</body>
</html>
Fichier index.html
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <style>
      body { text-align: center; }
      div { display: inline-block; }
      iframe { border: none; }
      nav {
        background-color: #9ee;
        padding: 15px;
      }
    </style>
  </head>
  <body>
    <div>
      <iframe src="page.html"></iframe>
      <nav><button type="button">Cliquer</button></nav>
    </div>
  </body>
</html>
Le navigateur lit le fichier index.html en affichant un rectangle jaune au dessus d'un rectangle bleu, mais séparés par un petit espace. Pourquoi y a-t-il ce petit espace entre les deux rectangles? Quelle est la bonne manière de le supprimer, de sorte que les rectangles restent collés l'un à l'autre?