텍스트를 위쪽 텍스트 오른쪽에 정렬합니다 (왼쪽 정렬). 알 수없는 폭

Question

헤더 제목이 모두 폭이 알 수없는 왼쪽

에 정렬하고, 그들에 설정된 글꼴 크기가

--------------------------------------------------------- 
|THIS IS THE LARGE HEADER TITLE       | 
|    - small slogan       | 
|-------------------------------------------------------- 

<div id="header"> 
<h1>This is the large header title</h1> 
<p>Small slogan here</p> 
</div> 

있어 동안 나는, 헤더 제목의 오른쪽에 슬로건 텍스트를 정렬하기 위해 노력하고있어

너비가 설정되지 않은 경우 CSS로 수행 할 수 있습니까? 아니면 어떻게해야합니까?

슬로건의 폭 : "relative"+ text-align : right or something like? 머리글 왼쪽 떠 경우

Answer 1

경우 .. .

DEMO

<div id="header"> 
    <div class="wrap"> 
     <h1>This is the large header title</h1> 
     <p>Small slogan here</p> 
    </div> 
</div> 

---

.wrap { 
    display: inline-block; 
} 
p { 
    text-align: right; 
} 

Answer 2

, 그것은 사업부 컨테이너를 축소하고 단락에 텍스트를 맞 춥니 다 사용할 수 있습니다 : 여분의 마크 업이 허용

이

#header { 
    float:left; 
} 
#header p { 
    text-align:right; 
} 

jsFiddle example