Solved

scrollbar -URGENT

Posted on 2003-11-30
5
510 Views
Last Modified: 2010-04-09
hi,
 I have a scroll bar that works when i put it for table .but now i need to put the whole form in a scrooll:

this is what i use:
<div style="overflow: auto; width: 800px; height: 400;  padding:2px; clear:all; margin: 0px">
...the form (very big)




</div>
BUt i am unable to get the scroollbar,the scrooll bar gets situated in between and not for the whole form.
For the example i have scroollbar
for:

username:
password:
..
.....

i were to make the height longer, it stays between here but not full,is it because i use other div also
thanks

0
Comment
Question by:Jasbir21
  • 3
5 Comments
 
LVL 7

Expert Comment

by:gam3r_3xtr3m3
ID: 9844801
clearer explanation please.
0
 

Author Comment

by:Jasbir21
ID: 9844868
..hi,
  i need to have a form in a scroll bar, and i used this:

<div style="overflow: auto; width: 800px; height: 400;  padding:2px; clear:all; margin: 0px">
...the form (very big)




</div>
but i am unable, but if i were to use this same thing to put it for a table,meaning i can use this div... to put a table in a scroolbar but not a form, i think maybe theere is other div in the form , that 's why it is not.

pls help
0
 

Author Comment

by:Jasbir21
ID: 9844930
i mean - i need to put the whole form in a scrooll bar

thanks
0
 
LVL 31

Accepted Solution

by:
seanpowell earned 100 total points
ID: 9845082
Hi,

The div you're using is fine - we just need to make sure that your placing it correctly and using the right heights:

Let's look at the page below:

<html>
<head>
<title>Hello</title>
<style type="text/css">
<!--
form  {
      font-family: Arial, Helvetica, sans-serif;
      font-size: 14px;
      color: #000000;
      }

input {
      width: 100px;
      }

label {
      float: left;
      width:100px;
      padding-left:30px;
      }
   
//-->
</style>
</head>
<body>
<div style="overflow: auto; width: 800px; height: 100px;  padding:2px; clear:all; margin: 0px">
<form>
<label for="username">Username:</label> <input type="text" name="username"><br />
<label for="password">Password:</label> <input type="text" name="password"><br />
<div style="width:100px; height:30px; float:left; padding:0px;"></div><span style="width:100px;">HouseNo1:</span> <input type="text" sixe="10" name="HouseNo1"><br />
<div style="width:204px; height:30px; float:left; clear:left;"></div><span style="width:100px;">HouseNo2:</span> <input type="text" sixe="10" name="HouseNo2"><br />
</form>
</div>
</body>
</html>

Notice that this div uses a height of 100px. The current height of the form example I've used is more than that, so you'll get a scrollbar. If you change the height of the div to 400px for example, the scrollbar will disappear because the div is now higher than the form.

Are you coding the page as per my example here, and the height you set for the div is less than the height of the form, and you're still not getting the scrollbar?
0
 

Author Comment

by:Jasbir21
ID: 9845325
hi,
It was my fault, the div i did not put in right postion.
Thank you so much for being very helpful and patient with me.
Thanks and  God bless you.



0

Featured Post

Courses: Start Training Online With Pros, Today

Brush up on the basics or master the advanced techniques required to earn essential industry certifications, with Courses. Enroll in a course and start learning today. Training topics range from Android App Dev to the Xen Virtualization Platform.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses four methods for overlaying images in a container on a web page
This article explains how to prepare an HTML email signature template file containing dynamic placeholders for users' Azure AD data. Furthermore, it explains how to use this file to remotely set up a department-wide email signature policy in Office …
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).

776 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question