2017-10-10 3 views
-1

height: 100%;으로 div를 만들려고하는데 배경이 고정 된 위치 여야합니다.오버 플로우 -y가 고정 위치로 작동하지 않습니다.

나는 비슷한 질문을 한 사람의 대답처럼 box-sizing:border-box;을 사용해 보았지만, 저에게는 효과가 없습니다. 또한 절대 위치를 사용하려고했지만 여전히 동일합니다. 여기

는 HTML을

내 CSS를

.backgroundIdKlupa { 
position:fixed; 
padding: 0; 
z-index: 999999; 
margin-bottom: 45px; 
} 
.backgroundIdKlupa_tablica { 
background-color: grey; 
top: 0; 
bottom:0; 
position:fixed; 
overflow-y:scroll; 
overflow-x:hidden; 
} 
.idKlupa_tablica { 
height: 90%; 
font-size: 14px; 
font-weight: bold; 
margin-bottom: 45px; 
} 
.backgroundIda { 
background-color: green; 
width: 100%; 
height: 550px; 
} 

입니다

<div class="backgroundIdKlupa col-lg-1 col-md-1 col-sm-2 col-xs-12"> 
      <table class="backgroundIdKlupa_tablica table-hover"> 
       <thead> 
        <tr> 
         <th class="backgroundIdKlupa_izbornik_th">Bench ID</th> 
        </tr> 
       </thead> 
       <tbody> 
        <tr> 
        <td class="aktivniItem backgroundIdKlupa_izbornik_td" >123</td> 
        </tr> 
        <tr> 
        <td class="aktivniItem backgroundIdKlupa_izbornik_td" >123</td> 
        </tr> 
        <tr> 
        <td class="aktivniItem backgroundIdKlupa_izbornik_td" >123</td> 
        </tr> 
       </tbody> 
      </table> 
     </div> 
     <div class="backgroundIda col-lg-1 col-md-1 col-sm-2 col-xs-12"></div> 

왼쪽 메뉴를 수정해야하지만, 더 항목이있는 경우에, 오버 플로우 - y를 가질 필요가 : 자동

오른쪽 내용 (녹색)은 규칙적입니다. Thnx

답변

1
For add scroll in any element you need to add height or max-height. second this is a table so make it a block element by using display:block 

backgroundIdKlupa_tablica { 
    background-color: grey; 
    top: 0; 
    bottom: 0; 
    position: fixed; 
    overflow-y: scroll; 
    overflow-x: hidden; 
    height: 50px; 
    display: block; 
} 
+0

당신은 Ankit Awasthi입니다. 이 작품은,하지만 높이를 높이를 추가해야합니다 : 100 %; 그러나 퍼센트는 작동하지 않습니다. – Arter

+1

. backgroundIdKlupa_tablica { \t \t \t \t background-color : gray; \t \t \t \t 상단 : 0; \t \t \t \t 하단 : 0; \t \t \t \t 위치 : 고정; \t \t \t \t overflow-y : auto; \t \t \t \t overflow-x : hidden; \t \t \t \t 높이 : 100 %; \t \t \t \t display : 블록; \t \t \t \t} 여기서 나를 위해 일하는 것은 테이블에 충분한 행을 추가하는 것입니다. –

관련 문제