잘린 텍스트를 정상적으로 표시하지만 호버에 전체 텍스트 표시

Question

div 안에 텍스트가있는 div가 있습니다. 나는 처음 몇 단어를 정상적으로 보여주고 싶지만, 마우스를 올리면 전체 텍스트를 보여주고 싶다. 이상적으로는 CSS 만 사용하고 데이터 복제는 필요하지 않습니다.

이것은 내가 무엇을 시도했다입니다 : 텍스트 DIV 3.이 가능 덮고있는 전체 텍스트를 표시하는 확장에만 DIV 2, 확장 할 때 http://jsfiddle.net/SEgun/

나는 이동 된 div 싶지 않아? 추신 지체 된 브라우저는 신경 쓰지 않습니다. 이것에 대해

Answer 1

.

position: absolute; 
background-color:#FFF; 

배경색은 중요하므로 아래 내용은 볼 수 없습니다.

모든 것이 동일한 위치에 유지되도록하려면 다음 요소에 줄 높이와 같은 값의 위쪽 여백을 줄 수 있습니다. + 부호는 adjacent sibling 셀렉터입니다.

div { 
    line-height: 20px; 
} 
#data:hover+div { 
    margin-top:20px; 
} 

DEMO

Answer 2

내용 : CSS는 아래에 내려 콘텐츠를 밀어하지 않도록 사업부가 그 아래 모든 것을 "포함"하게됩니다 http://jsfiddle.net/KGqnj/