18041 sujets

Questions générales et questions de débutants

[Résolu] Marge du bas

Bonjour!
Je n'arrive pas à supprimer une petite marge du bas. Je finis ma page avec une vague bleue en SVG mais il reste une petite marge couleur du fond de page.

html

<div class="vague">
      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320"><path fill="#0099ff" fill-opacity="0.5" d="M0,160L48,165.3C96,171,192,181,288,160C384,139,480,85,576,96C672,107,768,181,864,218.7C960,256,1056,256,1152,234.7C1248,213,1344,171,1392,149.3L1440,128L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path></svg>
    </div>
</body>
</html>



CSS


.vague {
  position:absolute;
bottom:0;
width:100%;
}

Modifié par _laurent (10 Apr 2021 - 14:13)
J'ai oublié de préciser mon body est déjà à 0


body {
	
    margin:0;
    padding:0;
    background: navy;
   
}

Modifié par _laurent (10 Apr 2021 - 14:12)
Modérateur
Salut,

C'est un petit soucis d'espace que l'on rencontre souvent sur les images. Une solution est d'ajouter line-height:0; à .vague

.vague {
  position:absolute;
  bottom:0;
  width:100%;
  line-height:0;
}


Au passage merci d'utiliser les balise de coloration syntaxique pour les bout de code s'il vous plait Smiley smile

Bonne journée
Modifié par _laurent (10 Apr 2021 - 14:13)
Meilleure solution
Modérateur
Le scroll est sur toute la page ou seulement su le bloc .vague ? Un overflow:hidden; pourrait peut être régler le soucis mais je suis sur Windows j'ai pas Safari (la version Win est bcp trop vieille personne ne l'utilise)
A force de bidouiller le scroll a disparu...Encore merci pour ton aide.
Tout fonctionne correctement sur mon Mac et mon iPad quel que soit le navigateur. Ton astuce line-height fonctionne aussi. C'est super!
Sur Windows je n'en sais rien. J'envoie une copie d'écran pour savoir si tu as la même chose sur ton PC. On a beau avoir un code propre, on n'a pas le même affichage selon le navigateur utilisé,le système utilisé: c'est rageant!
Sujet clos
Aller à