Margin-Top ne fonctionne pas pour l'élément span ?

Question

Quelqu'un peut-il me dire ce que j'ai mal codé ? Tout fonctionne, la seule chose est qu'il n'y a pas de marge en haut.

HTML :

<div id="contact_us"> <!-- BEGIN CONTACT US -->
  <span class="first_title">Contact</span>
  <span class="second_title">Us</span>
  <p class="content">For any questions whatsoever please contact us through the following e-mail address:</p></br></br>
  <p class="e-mail">info@e-mail.com</p></br></br></br></br>
  <p class="read_more"><a href="underconstruction.html">Read More</a></p>
</div> <!-- END CONTACT US -->

CSS :

span.first_title {
  margin-top: 20px;
  margin-left: 12px;
  font-weight: bold;
  font-size: 24px;
  color: #221461;
}

span.second_title {
  margin-top: 20px;
  font-weight: bold;
  font-size: 24px;
  color: #b8b2d4;
}

Answer 1

N'oubliez jamais une chose : nous ne pouvons pas appliquer de marge verticale aux éléments en ligne. Si vous voulez appliquer des marges verticales, changez son type d'affichage en block o inline-block

span {
    display: inline-block;
}