Espacement inhabituel avec des flotteurs et des text-align

Question

J'ai mon nom de société sur la gauche et mon email sur la droite. J'ai l'email mis en place comme ceci:

<div style="color: white; float: right; padding-right: 10px; text-align:right"> 
    <p style="font-size: 16px;">E-mail</p> 
    <p style="font-size: 20px; text-decordation: none;">newtrendphotography23@gmail.com</p> 
</div>  

Comme je suis incapable de télécharger des photos, cela peut être difficile à expliquer. Il y a un espace vertical (comme la hauteur du nom de l'entreprise) entre le mot "email" et mon email actuel.

est ici toute (pertinente) HTML:

HTML:

<div style="margin: 0 auto; overflow: auto;"> 
    <div style="background: #000; height: 80px; width: 100%; overflow: hidden;"> 
     <h1 style="font-family: Snell Roundhand, cursive; padding-left: 10px; color: white; float: left;">New Trend Photography</h1> 
     <div style="color: white; float: right; padding-right: 10px; text-align:right"> 
      <p style="font-size: 16px;">E-mail</p> 
      <p style="font-size: 20px; text-decordation: none;">newtrendphotography23@gmail.com</p> 
     </div>  
    </div> 
</div> 

Answer 1

Cet écart est dû au fait de l'élément de marge et le rembourrage p.

Utilisation:

div p { 
    margin: 0; 
    padding: 0; 
} 

Si vous voulez, supprimer écart entre e-mail et mon email réelle seulement.

Il faut donc utiliser:

div p { 
    margin: 0; 
    padding: 0; 
} 

div p:first-child { 
    margin-top: 20px; 
} 

Demo