How To Set Vertical And Horizintal ScrollBar For A Div

Question

0.00/5 (No votes)

See more:

hi I have A div

.Test
{
Width:500px;
height:500px;
background-color:Red;
}

HTML

<div class="Test">

</div>

i Want Set ScrollBar For This Div
both Vertical and Horizintal Scroll

thanks so much

Posted 28-Aug-12 2:14am

Seyed Ahmad Mirzaee

Add a Solution

6 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

bhagirathimfs · Answer 1 · 2012-08-28T02:37:00

Solution 4

This may help you
http://www.way2tutorial.com/html/example/scrollbox_verticlal_horizontal.php[^]

Posted 28-Aug-12 2:37am

bhagirathimfs

Comments

Seyed Ahmad Mirzaee 28-Aug-12 8:59am

in Opera Not Show Please Check It

thanks

Seyed Ahmad Mirzaee · Answer 2 · 2012-08-28T02:27:00

Solution 1

i Founded

i Use Overflow:Scroll

Posted 28-Aug-12 2:27am

Seyed Ahmad Mirzaee

_Amy · Answer 3 · 2012-08-28T02:30:00

Solution 2

Setting the overflow will take care of scrollbars, but you need to set the height of div also. If the height attribute is not set, the div will grow vertically as tall as it needs to, and scrollbars wont be needed.

See Example here[^].

--Amit

Posted 28-Aug-12 2:30am

_Amy

Comments

Seyed Ahmad Mirzaee 28-Aug-12 8:44am

When Use OverFlow:Scroll and set Height:100px
but Scroll in X Pilot Is Not Work When A string Is Very Long!
if Use this string inside Div:sssssssssssssssssssssssssssssssssssss...
then Div Only Show ssssssssssssssss
and Not Show Reminded string
please Help me
thanks

_Amy 28-Aug-12 9:11am

Set the height and width both for the div. :)

pramod.hegde · Answer 4 · 2012-08-28T02:35:00

Solution 3

Set overflow property to either hidden, visible, auto and scroll depending on your requirement.

CSS

.Test
{
Width:500px;
height:500px;
background-color:Red;
overflow:scroll;
}

Posted 28-Aug-12 2:35am

pramod.hegde

abhishekdhanotia · Answer 5 · 2012-08-28T03:40:00

XML

<html>
<head>
<style type='text/css'>
.dvContent
{
Width:200px;
height:100px;
background-color:gray;
overflow:scroll;
}
</style>
</head>
<div class='dvContent'>
<input id='txtTest'  type="text"/>
<input id='txtTest'  type="text"/>
<input id='txtTest'  type="text"/>
<input id='txtTest'  type="text"/>
<input id='txtTest'  type="text"/>
<input id='txtTest'  type="text"/>
<input id='txtTest'  type="text"/>
<input id='txtTest'  type="text"/>
</div>
</html>

Ganesh Nikam · Answer 6 · 2012-08-28T19:26:00

Solution 6

hiii,
just change

CSS

.Test
{
Width:500px;
height:500px;
background-color:Red;
overflow:auto;
}

Posted 28-Aug-12 19:26pm

Ganesh Nikam