두 스팬 요소 사이의 높이 조정

Question

div 내부의 두 스팬 요소 사이에 세로 간격을 조정하려고합니다. 내가 얻는 바의 절반을 달성하려고 노력하고있다. <br/>.

line-height, vertical-align 또는 margin-top. 아무 것도 저에게 효과가 없었습니다. jsfiddle

Answer 1

<span> 요소가 인라인입니다. 블록 레벨 요소 인 <p을 인라인 요소 안에 넣을 수 없습니다.

사용 <div>의 대신 <span>들과 CSS는 잘 작동합니다

<div class="signupEmailBox"> 
    <div class="tag"><p>test data goes here</p></div> 
    <div class="smallTextEmail"> 
        <p>blah blah blah</p> 
        <p>some text goes here...</p> 
        <p>here some more text data</p> 
        <p>some more text</p> 
    </div> 
</div> 
​ 

Answer 2

다른 사람의 사이 여백의 응용 프로그램에 영향을 미치는 display라는 이름의 속성이 있습니다. 이 속성의 기본값은 span 요소에 대해 inline입니다. 따라서 여백이 적용되지 않습니다.

div 상자와 같은 다른 기본값을 가진 요소를 사용하거나 span 요소의 display 속성 값을 변경하십시오. inline-block은 span 요소의 텍스트 흐름 기능을 유지하기 때문에 사용하는 것이 좋습니다.

span 
{ 
    display:inline-block; 
}