Forcing a DIV to stretch the length of a page

John Smith

In Mozilla/Netscape, is it possible to make a DIV stretch the length
of a page ithout resorting to the "repeat background
image" trick?
Thank you!

Jul 20 '05 #1

Johannes Koch

John Smith wrote:

In Mozilla/Netscape, is it possible to make a DIV stretch the length
of a page ithout resorting to the "repeat background
image" trick?

What is "the length of a page"? Is it

a) the length of the content, or
b) the length of the viewport?

--
Johannes Koch
In te domine speravi; non confundar in aeternum.
(Te Deum, 4th cent.)

Jul 20 '05 #2

John Smith

On Mon, 17 May 2004 10:02:51 +0200, Johannes Koch
<ko**@w3development.de> wrote:

:John Smith wrote:
:> In Mozilla/Netscape, is it possible to make a DIV stretch the length
:> of a page ithout resorting to the "repeat background
:> image" trick?
:
:What is "the length of a page"? Is it
:
:a) the length of the content, or
:b) the length of the viewport?
Length of the viewport. Sorry for not being specific.

Jul 20 '05 #3

Brian

John Smith wrote:

Johannes Koch <ko**@w3development.de> wrote:

John Smith wrote

In Mozilla/Netscape, is it possible to make a DIV stretch the
length of a page ithout resorting to the "repeat background
image" trick?

What is "the length of a page"?

Length of the viewport.

height: 100% should do it, then. If the div has static position, you
need to set a height on body, too.

div {position: absolute; height: 100%;}

/* or */

body {height: 100%;}
div {height: 100%;}

--
Brian (remove "invalid" from my address to email me)
http://www.tsmchughs.com/

Jul 20 '05 #4

John Smith

On Mon, 17 May 2004 20:12:33 -0400, Brian
<us*****@julietremblay.com.invalid> wrote:

:John Smith wrote:
:> Johannes Koch <ko**@w3development.de> wrote:
:>
:>> John Smith wrote
:>>> In Mozilla/Netscape, is it possible to make a DIV stretch the
:>>> length of a page ithout resorting to the "repeat background
:>>> image" trick?
:>>
:>> What is "the length of a page"?
:>
:> Length of the viewport.
:
:height: 100% should do it, then. If the div has static position, you
:need to set a height on body, too.
:
:div {position: absolute; height: 100%;}
:
:/* or */
:
:body {height: 100%;}
:div {height: 100%;}
This works with IE, but Mozilla does not seem to respect it.

Jul 20 '05 #5

Brian

John Smith wrote:

Brian wrote: :div {position: absolute; height: 100%;}
:
:/* or */
:
:body {height: 100%;}
:div {height: 100%;}

This works with IE, but Mozilla does not seem to respect it.

*Which* works with IE? Did you try both? As usual, a url would help.

When I needed to do this, I found IE/Win to be a headache; Moz was a
snap by comparison. If you want to see an example of div with 100%
height, take a look at the main nav of

http://www.tsmchughs.com/

This uses position: fixed, though, and that changes things.

--
Brian (remove "invalid" from my address to email me)
http://www.tsmchughs.com/

Jul 20 '05 #6

John Smith

On Tue, 18 May 2004 11:19:10 -0400, Brian
<us*****@julietremblay.com.invalid> wrote:

:John Smith wrote:
:
:> Brian wrote:
:
:> :div {position: absolute; height: 100%;}
:> :
:> :/* or */
:> :
:> :body {height: 100%;}
:> :div {height: 100%;}
:>
:> This works with IE, but Mozilla does not seem to respect it.
:
:*Which* works with IE? Did you try both? As usual, a url would help.
:
:When I needed to do this, I found IE/Win to be a headache; Moz was a
:snap by comparison. If you want to see an example of div with 100%
:height, take a look at the main nav of
:
:http://www.tsmchughs.com/
:
:This uses position: fixed, though, and that changes things.

I do not use a position: attribute at all. So that may be the problem.
Take a look at http://rhpt.com.

Jul 20 '05 #7

Brian

John Smith wrote:

Brian wrote:

As usual, a url would help.

I do not use a position: attribute at all. So that may be the
problem. Take a look at http://rhpt.com.

I did. (Why have you decided to override my font size?) After vetoing
your font size, I'm left wondering which div you want to extend. I'm
guessing that it's the nav on the left? You have 5 imported stylesheets.
I can't find the one that has the nav styles. You're not making it easy
to help.

One more thing: how about validating your xhtml?

--
Brian (remove "invalid" from my address to email me)
http://www.tsmchughs.com/

Jul 20 '05 #8

John Smith

On Tue, 18 May 2004 20:21:52 -0400, Brian
<us*****@julietremblay.com.invalid> wrote:

:John Smith wrote:
:
:> Brian wrote:
:>
:> As usual, a url would help.
:>
:> I do not use a position: attribute at all. So that may be the
:> problem. Take a look at http://rhpt.com.
:
:I did. (Why have you decided to override my font size?) After vetoing
:your font size, I'm left wondering which div you want to extend. I'm
:guessing that it's the nav on the left? You have 5 imported stylesheets.
:I can't find the one that has the nav styles. You're not making it easy
:to help.
:
:One more thing: how about validating your xhtml?

It's in general.css, the class page-portlet-1.

Jul 20 '05 #9