HTML 새 줄의 임의의 공간

Question

저는 웹 기술에 대해 1 년 동안 매우 편안하게 작업 해 왔지만 이상한 행동을 일으키는 원인이 무엇인지 전혀 모릅니다.

사진 공유 앱을 만들고 있습니다. 각 사진에는 사진이 왼쪽 위 모서리에 게시 된 시간과 포스터의 이름이 오른쪽 하단 모서리의 캡션에 따라 새 줄에 따라 고유 한 페이지가 있습니다. 여기

<div class="postInfo">Name goes here<br/>This is a caption</div> 

내 스타일은 다음과 같습니다 : 내 코드는 다음과 같습니다 내가 페이지를 실행하면 예상대로

.postInfo { 
    position: absolute; 
    left:0; 
    bottom:0; 
} 

이, 포스터 이름과 자막 정확하게 표시하지만, 어떤 이유로 캡션은 공간이 그 전에. 나는 다음을 포함한 모든 대안을 시도했습니다 :

<p style="padding:0;margin:0">Name goes here</p> 
<p style="padding:0;margin:0">This is a caption</p> 

그리고 캡션 앞에 항상 공백이 있습니다. 나는 완전히 당혹 스럽다. 아무도이 원인이 될 수있는 어떤 단서가 있습니까?

Answer 1

요소는 조상으로부터 text-align:center을 상속 받았습니다. 단지 두 줄 밖에 없었기 때문에 무슨 일이 일어 났는지 알기 힘들었습니다. 그래서 그 공간이 어디에서 왔는지 전혀 몰랐습니다. 그것이 우주 공간이 아니 었음을 나타냅니다.