2016-10-18 1 views
5

Lorsqu'un formulaire est placé à l'intérieur d'un div, il y a toujours de l'espace supplémentaire au bas du formulaire pour une raison quelconque. Comment pouvons-nous nous débarrasser de cet espace?Espace blanc de Mystère au bas de l'élément de formulaire

Dans les extraits de code du débordement de pile, il ne montre pas réellement l'espace, mais ailleurs, il le fait. Le code ci-dessous est tout ce qu'il y a.

div { 
 
    border: 1px solid blue; 
 
} 
 
form { 
 
    border: 1px solid red; 
 
}
<div> 
 
    <form> 
 
    Form 
 
    </form> 
 
</div>

+2

Si vous ne pouvez pas le reproduire ici que nous ne pouvons pas aider. Ma conjecture sauvage est que vous avez une marge définie quelque part dans votre css. Vous pouvez utiliser les outils de développement pour vérifier le css calculé et voir d'où vient cette marge/padding –

+0

Ou cela pourrait faire partie des styles par défaut pour votre navigateur. Vous voudrez peut-être envisager de faire une réinitialisation CSS. – Jacob

+1

@ItayGal Le code est tout ici. C'est juste quelque chose avec l'extrait de stackoverflow qui corrige des choses comme ça, quand il n'est pas corrigé ailleurs. Voici un lien vers la page avec le problème: http://chatwithibot.com/testx.php – frosty

Répondre

0

Vous avez un margin-bottom: 16px. Retirez-le et cela va résoudre votre problème.

+0

Cela doit être par défaut. Parce que je ne l'ai pas défini dans le HTML. – frosty

+0

Vous pouvez faire une réinitialisation CSS et définir tous les paddings/marges. http://cssreset.com/what-is-a-css-reset/ –

4

Vous pouvez consulter les outils de développement web (F12), et vous verrez qu'un élément form est livré avec un margin-bottom: 1em, tel que défini dans la browser's default stylesheet:

enter image description here

Vous pouvez passer outre qu'en définissant votre propre règle de marge:

form { margin-bottom: 0; }