2015-01-19 8 views
0

데이터가 포함 된 div (상대적으로 배치 된)가 있으며 상자 위에 일련의 단추가 있어야합니다. 이 버튼들은 절대 위치 지정을 사용하는 div입니다. 그러나 포함 된 div 외부에 배치하면 표시되지 않습니다. 포지셔닝이 양수이면 (메인 디비 내) 괜찮습니다. 절대 위치 지정된 div (또는 다른 요소, 나는 까다 롭지 않다)를 컨테이너의 경계 밖에서 보여줄 수 있습니까? 그렇다면 어떻게?요소가 포함 된 요소의 경계 외부에 표시되지 않습니다.

'버튼'중 CSS의 중요한 부분은 "위치 : 절대, 오른쪽 : -3px, 너비 : 20px, 위쪽 : -27px"입니다. (적절한시기 자바 스크립트가 켜져 공개/디스플레이)

주 사각형 다음 CSS 방식을 갖는다 :

echo " <div id='$portalid.ButtonDelete' 
style='border:2px solid ".$onefield["Color.Border"]."; text-align: center; color: ".$onefield["Color.Text"]."; background: ".$onefield["Color.Fill"]."; 
position: absolute; right: ".$ButtonRight."px; width: 20px; top: -2px; 
font-family: Sans-Serif; font-weight: bold; 
height: 20px; padding-top: 2px; 
z-index:1; cursor:pointer;' title='Delete selected ".$onefield["Display"]."' onclick='alert(\"Not implemented\");'> 
X 
</div>"; 
:

.ob{ 
    visibility:hidden; 
    display:none; 
    position:relative; 
    left:1; 
    top:1; 
    text-align: left; 
    vertical-align: top; 
    padding-top: 12px; 
    margin-bottom: 20px; 
    padding-left:2px; padding-right:2px; 
    border-collapse: collapse; 
    overflow: auto; 
} 

예는 다음 PHP로 정의 로 번역

: t :

<div id='Delete' 
style='border:2px solid red; text-align: center; color: White; background: Pink; 
position: absolute; right: -2px; width: 20px; top: -24px; 
font-family: Sans-Serif; font-weight: bold; 
height: 20px; padding-top: 2px; z-index:1; cursor:pointer;' 
title='Delete selected records' onclick='alert(\"Not implemented\");'> 
X 
</div>"; 
+1

oveflow : 메인 div에 숨겨져 있습니다. 그냥 제거하십시오. –

+1

두 가지 모두에 CSS를 게시 할 수 있습니까? 컨테이너 및 버튼? – jmore009

+0

[jsfiddle] (http://jsfiddle.net/henc9uhs/)과 같이 top의 마이너스 값은 문제가되지 않습니다. 부모 div에'overflow : hidden'이 있다고 생각합니다. – wander

답변

0

나는 "자동 오버 플로우"를 변경하여 문제를 해결 o 주 사각형에 대한 ".ob"CSS에서 "overflow : visible". 저는 4 개의 '버튼'이 이제는 주 사각형 (내가 원함) 위에 잘 앉았 기 때문에 혼란 스러워요. 그러나 사각형의 고정 높이를 지정하면 내용이 계속 스크롤됩니다. (또한 원하는 것도 있지만 '