Improve company productivity with a Business Account.Sign Up

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1094
  • Last Modified:

CSS Div stretching issue (min-height)?

The page in question is here:
http://stage2.daileydev.com/

The main CSS mile is at:
http://stage2.daileydev.com/css/all.css

The "container" div contains a 1 pixel background which creates the grey divider line between the side navigation and the content section.

The issue is that I need that container to stretch to meet the bottom of the browser window so that it touches the outside box, even when the content is not long enough to make the div stretch.  I tried experimenting with the min-height: 100% element on various tags, but I wasn't able to get it to work.  Any help would be appreciated.

Ideas?
0
OaktownBill
Asked:
OaktownBill
  • 5
  • 5
1 Solution
 
amar31282Commented:
HI OaktownBill,

The where are you facing the issue and in which browser. i can't find any issues with the height the container is expanding and the background line is also resizing with that.

Please be little more specific

Regards,
Amarjit
0
 
OaktownBillAuthor Commented:
Hi Amarjit,

I'm seeing it on IE7 and Firefox 3 on Windows.  It's not visible unless the browser window is big enough or the screen resolution is high enough it seems.

Bill
0
 
amar31282Commented:
try this
#page-box {all.css (line 65)
background:transparent url(../images/bg-body.gif) repeat-y scroll 0 0;
height:100%;
margin:0 auto;
min-height:100%;
width:872px;
}
#main {all.css (line 156)
height:inherit;
padding:32px 11px 0 12px;
}
0
Get 10% Off Your First Squarespace Website

Ready to showcase your work, publish content or promote your business online? With Squarespace’s award-winning templates and 24/7 customer service, getting started is simple. Head to Squarespace.com and use offer code ‘EXPERTS’ to get 10% off your first purchase.

 
OaktownBillAuthor Commented:
Thanks for working on this.  Unfortunately, the issue is still there with the updated code.  Very perplexing..

Bill
0
 
amar31282Commented:
i am not getting exactly what you want can you please explain your needs.

When do you want the div to stretch
0
 
OaktownBillAuthor Commented:
Here is a sceen shot showing what I am seeing:

http://stage2.daileydev.com/line_issue.gif

The divider line is part of the container DIV and it seems to end after the footer.  What I need is for the container to reach the bottom of the browser window.
0
 
amar31282Commented:
how are you increasing the height and making the empty space.

It is working fine at my end in IE7, IE8, FF3
heightff.png
height.png
0
 
OaktownBillAuthor Commented:
I was able to get this to work by adding the divider line to the background image.  Thanks for your assistance.
0
 
OaktownBillAuthor Commented:
Solution found.
0
 
amar31282Commented:
so it worked at your end or not
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

What Kind of Coding Program is Right for You?

There are many ways to learn to code these days. From coding bootcamps like Flatiron School to online courses to totally free beginner resources. The best way to learn to code depends on many factors, but the most important one is you. See what course is best for you.

  • 5
  • 5
Tackle projects and never again get stuck behind a technical roadblock.
Join Now