Bonjour,

J'ai un header ainsi qu'un formulaire. Le problème est que le formulaire dépasse sur le header et sort de la page. Ainsi, on ne peut plus voir le haut du formulaire. J'ai utilisé flexbox pour le moment. Pouvez-vous m'aider afin que le haut du formulaire débute après le header svp ?

Mon code actuel : https://codepen.io/Titouan79/pen/OerXjB

Merci d'avance

Salut !

En rajoutant les lignes suivantes dans ton CSS, ça a l'air de fonctionner

.default-form {
  margin-top: 150px;
}

Salut,

Enlève simplement la propriété css ci-dessous sur ta section : 

height: calc(100vh - 60px);

Salut,

comme tu n'aura pas forcément un form partout, autant mettre un padding-top à body de la hauteur de ton menu.

En passant ce code est à mettre directement à la poubelle :

* {
  margin: 0;
  padding: 0;
}

Ouais en fait j'appuie la réponse de FloJDM, fais pas ce que je t'ai dit, sa solution est BIEN meilleure

FloJDM a écrit:

Salut,

Enlève simplement la propriété css ci-dessous sur ta section : 

height: calc(100vh - 60px);

Bien vu.

Merci beaucoup ! Ca fonctionne parfaitement si je fais ce qu'à dit FloJDM

Et j'ai aussi enlevé les margin:0 et padding: 0 comme Frogweb.

-
Edité par TitouanDev 10 juillet 2019 à 18:26:51

PS : Je viens juste de remarquer qu'un margin-top de 19.92px s'est ajoutée sur le h1 ("HANDBALL-CLUB MANAGER") pour aucune raison. Je ne vois pas comment ça se fait, car je n'ai mis qu'une margin-bottom dessus. En plus, dans l'inspecteur d'éléments, il n'y a pas de propriété margin-top. Si vous pouviez m'aider, ce serait super.

Bonjour,

h1, comme beaucoup d'autres éléments en HTML, a des marges natives définies par la feuille de style du navigateur. Tu ne t'en rendais pas compte avant car ton sélecteur  * { margin:0;padding:0} les supprimait toutes. Ce n'est effectivement pas une bonne pratique, il est préférable de supprimer les marges natives au cas par cas. 

Il faut donc que tu définisses un margin-top:0 pour ton h1

Merci !