Question

我尝试使用height: 100%;创建div，但背景需要有固定的位置。

我尝试使用box-sizing:border-box;像某人一样回答类似我的问题，但这对我不起作用。此外，我试图使用绝对位置，但仍然相同。

这是我的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;
}

HTML

<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：auto

正确的内容（绿色）是正常的。日Thnx

Answer 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;
}

溢出-y不能使用固定位置

1 个答案: