How do you add a scroll bar to a div?

后端未结

关注

 6  1878

I have a popup that displays some results, and I want a scroll bar to be display since the results are being cutt off (and I don\'t want the popup to be too long).

相关标签:

6条回答

醉酒成梦

2020-12-08 13:13

<div class="scrollingDiv">foo</div> 

div.scrollingDiv
{
   overflow:scroll;
}

0 讨论(0)

隐瞒了意图╮

2020-12-08 13:18

Css class to have a nice Div with scroll

.DivToScroll{   
    background-color: #F5F5F5;
    border: 1px solid #DDDDDD;
    border-radius: 4px 0 4px 0;
    color: #3B3C3E;
    font-size: 12px;
    font-weight: bold;
    left: -1px;
    padding: 10px 7px 5px;
}

.DivWithScroll{
    height:120px;
    overflow:scroll;
    overflow-x:hidden;
}

0 讨论(0)

轻奢々

2020-12-08 13:19
If you want to add a scroll bar using jquery the following will work. If your div had a id of 'mydiv' you could us the following jquery id selector with css property:
```
jQuery('#mydiv').css("overflow-y", "scroll");
```
0 讨论(0)
发布评论:

提交评论
- 加载中...

感动是毒

2020-12-08 13:22

<head>
<style>
div.scroll
{
background-color:#00FFFF;
width:40%;
height:200PX;
FLOAT: left;
margin-left: 5%;
padding: 1%;
overflow:scroll;
}


</style>
</head>

<body>



<div class="scroll">You can use the overflow property when you want to have better       control of the layout. The default value is visible.better control of the layout. The default value is visible.better control of the layout. The default value is visible.better control of the layout. The default value is visible.better control of the layout. The default value is visible.better control of the layout. The default value is visible.better </div>


</body>
</html>

0 讨论(0)

傲寒

2020-12-08 13:29

You need to add style="overflow-y:scroll;" to the div tag. (This will force a scrollbar on the vertical).

If you only want a scrollbar when needed, just do overflow-y:auto;

0 讨论(0)
发布评论:

提交评论
- 加载中...
逝去的感伤

2020-12-08 13:33
to add scroll u need to define max-height of your div and then add overflow-y

so do something like this
```
.my_scroll_div{
    overflow-y: auto;
    max-height: 100px;
}
```
0 讨论(0)
发布评论:

提交评论
- 加载中...