滚动条和不同的浏览器

时间:2014-01-08 17:30:28

标签: css css3

在IE中,我的网页的垂直滚动条出现在正在滚动的表格内(这就是我想要的)。在Chrome和Firefox中,它出现在外面。这很令人烦恼。有谁知道我能做什么,以便滚动条可以出现在所有三个浏览器的内部?这是我的CSS;

body
{
background-color:#d0e4fe;
font-family:"Arial";
}
h1
{
color:orange;
text-align:center;
}
p
{
font-family:"Tahoma";
font-size:20px;
}
table.header
{
table-align:left;
border-collapse:collapse;
width:auto;
font-size:3em;
font-weight:bold;
border:1px solid grey;
table-layout: fixed;
}
table.top
{
table-align:left;
border-collapse:collapse;
width:99.2%;
//width:1800px;
//width: 1330px;
//width:auto;
table-layout: fixed;
border:1px solid grey;
}
table.body
{
border-collapse:collapse;
width:100%;
border:1px solid grey;
table-layout: fixed;
table-align:left;
}
table.footer
{
table-align:center;
border-collapse:collapse;
width:auto;
table-layout: fixed;
}
td.header
{
//border:1px solid grey;
//word-wrap: break-word;
padding:10px;
}
.scroll 
{
max-height: 425px;
//overflow: auto;
//overflow: scroll;
overflow-y: auto;
overflow-x: hidden;
}
td.body
{
border:0px solid grey;
padding:10px;
text-align:left;
border:1px solid grey;
width:8.5%;
font-size:15px;
word-wrap: break-word;
}
td.footer
{
text-align:center;
padding:10px;
word-wrap: break-word;
}
th.body
{
text-align:left;
padding:10px;
border:1px solid grey;
//width:8.4%;
font-size:15px;
word-wrap: break-word;
}

1 个答案:

答案 0 :(得分:1)

see here documentation 要么 see here

.scroll::-webkit-scrollbar{
width: 12px; }


.scroll::-webkit-scrollbar-track{  
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    border-radius: 10px; }


.scroll::-webkit-scrollbar-thumb{ 
      border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); }
相关问题