Solved

scrollbar -URGENT

Posted on 2003-11-30
5
489 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
Comment Utility
clearer explanation please.
0
 

Author Comment

by:Jasbir21
Comment Utility
..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
Comment Utility
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
Comment Utility
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
Comment Utility
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

Find Ransomware Secrets With All-Source Analysis

Ransomware has become a major concern for organizations; its prevalence has grown due to past successes achieved by threat actors. While each ransomware variant is different, we’ve seen some common tactics and trends used among the authors of the malware.

Join & Write a Comment

Foreword (July, 2015) Since I first wrote this article, years ago, a great many more people have begun using the internet.  They are coming online from every part of the globe, learning, reading, shopping and spending money at an ever-increasing ra…
SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
In this Micro Tutorial viewers will learn how to create navigation buttons that change on rollover, using CSS (Continuation of the CSS Image Sprite tutorial) Create a parent ID for all the list items       - Specify position: absolute and display: block…
In this tutorial viewers will learn how to position overlapping items using z-index in CSS. They will also learn the restrictions on the z-index property.  Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Red.…

772 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

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now