CSS : 떠 다니는 이미지와 관련하여 텍스트 요소 가운데 맞추기

Question

왼쪽에 떠 다니는 이미지를 무시하도록하여 텍스트 요소 (이 경우 h2 부제목)의 가운데에 배치하고 싶습니다. 내 기본 설정은 h2 헤드 라인이 h1 헤드 라인과 수직으로 정렬되도록하는 것입니다. CSS만으로이 작업을 수행 할 수있는 방법이 있습니까?
다음은 샘플 레이아웃입니다.
http://tinyurl.com/84otx8y
참고 : 샘플 이미지의 너비와 높이가 변경 될 수 있습니다.

Answer 1

플로팅 요소를 무시 하시겠습니까? 그것은 가능하지만, 나는 당신의 h2 헤드 라인 폭에 경우이 못생긴 결과를 만들 것이다,이 권하고 싶지 않다 :이 솔루션은 이미지의 상단에 h2 경계를해야합니다

.wrapper{ 
    position:relative; 
} 

.wrapper h2{ 
    position:absolute; 
    left:0; 
    right:0; 
    margin-top:1.5em 
    z-index:2; 
} 
.wrapper h2 + p{ 
    margin-top:2.5em; 
} 

하는 것으로. 플로팅 이미지에 position:relative;z-index:4을 사용하면이를 방지 할 수 있습니다.