By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,261 Members | 1,616 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,261 IT Pros & Developers. It's quick & easy.

scable div height 100% javascript?

P: 20
I have a div which I have set to the height of 100% so it reaches the bottom of the page no matter the size of the browser resolution.

However, when the browser is resized the div no longer reaches the bottom of the page.

How do I set a div's height to 100% and keep it at this even if the browser window is resized?


Thanks.
Jun 21 '09 #1
Share this Question
Share on Google+
5 Replies


P: 20
I have relised that curently, the div only reaches the bottom of the visible page in the browser, if the browser where to scroll down, the div would not continue.

So I need the script to make the div reach the bottom of the page instead of just the bottom of the browser window's orginal location on the page.
Jun 21 '09 #2

acoder
Expert Mod 15k+
P: 16,027
You can probably do this with CSS alone without JavaScript. Give the parent container (body) 100% height.
Jun 22 '09 #3

P: 20
Dosn't work. When I scroll down the div does not continue.
Jun 22 '09 #4

iam_clint
Expert 100+
P: 1,208
see -> http://matthewjamestaylor.com/blog/u...ail-pixels.htm

The holy grail of css is what you are speaking of
Jun 22 '09 #5

P: 20
Is this right because it's not working?

style.css
Expand|Select|Wrap|Line Numbers
  1. /* commented backslash hack \*/ 
  2. html, body{height:100%;} 
  3. /* end hack */
  4. html,body {margin:0;padding:0}
  5. #dname{
  6. min-height:100%;
  7. height:auto;
  8. * html #dname{height:100%;}
  9.  
  10. body    {
  11. background-image: url(img.jpg);
  12. background-position: left top;
  13. background-repeat: no-repeat;
  14. background-color:#ffffff;
  15. }
  16.  
  17. div.dname    {
  18. background-image:url(dimg.jpg);
  19. background-position: left top;
  20. background-repeat: repeat;
  21. }
  22.  
Jun 22 '09 #6

Post your reply

Sign in to post your reply or Sign up for a free account.