This is Interesting: Free Magazines for Graphics designers and webmasters  


Home > Archive > Dreamweaver > September 2004 > My height:100% AP divs not extending beyond viewport height





You are viewing an archived Text-only version of the thread. To view this thread in it's original format and/or if you want to reply to this thread please [click here]

Author My height:100% AP divs not extending beyond viewport height
Lossed

2004-09-11, 11:15 pm

Hi everyone,

I am trying to get the side fading AP divs to work on this page:
http://www.mpg.net.nz/NewLayout/layout.htm

All was good until page height exceeded the viewport/browser height. Only
then did i notice these fading divs wouldn't extend 100% page height.
Is there a better way to achieve the same thing without the AP divs, or a
way to make them extend the full page height?

Tks 'yall,
Lossed.


-D-

2004-09-12, 4:14 am

I've experienced the same problem. Create a container div that will hold
all the content. Instead of creating two faded grey bar images, create one
image for the entire length of the background. Keep the height small
though...say about 15 or 20 pixels. So, if you want the width to be say 750
pixels wide, then you would make the grapic 750 pixels wide. Create the
graphic with the left and right faded grey bars with the rest of the middle
just white. Using CSS, choose the image as your background and repeat on
the y-axis. Then as your content within the container expands beyond the
viewport, so will the background image.

Hope this information helps!
-D-

"Lossed" <blankemail@hotmail.com> wrote in message
news:ci0447$6o0$1@forums.macromedia.com...
> Hi everyone,
>
> I am trying to get the side fading AP divs to work on this page:
> http://www.mpg.net.nz/NewLayout/layout.htm
>
> All was good until page height exceeded the viewport/browser height. Only
> then did i notice these fading divs wouldn't extend 100% page height.
> Is there a better way to achieve the same thing without the AP divs, or a
> way to make them extend the full page height?
>
> Tks 'yall,
> Lossed.
>
>



Lossed

2004-09-12, 4:14 am

Hi, tks for this. It's certainly an option I'll use if have to, although I
was hoping for a solution that would not restrict me to a fixed width. Is it
just not possible?

"-D-" <noone@nospam.com> wrote in message
news:ci0bdi$bfk$1@forums.macromedia.com...
> I've experienced the same problem. Create a container div that will hold
> all the content. Instead of creating two faded grey bar images, create
> one
> image for the entire length of the background. Keep the height small
> though...say about 15 or 20 pixels. So, if you want the width to be say
> 750
> pixels wide, then you would make the grapic 750 pixels wide. Create the
> graphic with the left and right faded grey bars with the rest of the
> middle
> just white. Using CSS, choose the image as your background and repeat on
> the y-axis. Then as your content within the container expands beyond the
> viewport, so will the background image.
>
> Hope this information helps!
> -D-
>
> "Lossed" <blankemail@hotmail.com> wrote in message
> news:ci0447$6o0$1@forums.macromedia.com...
>
>



-D-

2004-09-12, 4:14 am

Just as a quick follow-up. Each of the two graphics will only be about 25
to 50 pixels width depending on how wide you want the blue colored outside
margin to be.

-D-


"-D-" <noone@nospam.com> wrote in message
news:ci0e64$dar$1@forums.macromedia.com...
> Hmmm...you could try this. Create a graphic for the left side that

includes
> blue colored margin with the grey faded bar and then create the right side
> graphic with the grey faded bar with the blue colored outside margin.

Now,
> you'll have two graphic for the left and right side. Using CSS, set the
> body background to the left side image, horizontal position to left and
> repeat y-axis. Create the container div, but set the width to 100% so it
> will adjust to screen size. Using CSS, set the background of the

container
> div to the right side image, horizontal position to right and repeat

y-axis.
> I haven't tried it, so I'm not sure how that would work? I was just
> thinking out loud, but it's something to try.
>
> Let me know if it works. Hope that helps.
> -D-
>
>
>
> "Lossed" <blankemail@hotmail.com> wrote in message
> news:ci0clg$ca9$1@forums.macromedia.com...
I[color=darkred]
Is[color=darkred]
> it
> hold
create[color=darkred]
say[color=darkred]
the[color=darkred]
> on
> the
> Only
or[color=darkred]
> a
>
>



-D-

2004-09-12, 4:14 am

Hmmm...you could try this. Create a graphic for the left side that includes
blue colored margin with the grey faded bar and then create the right side
graphic with the grey faded bar with the blue colored outside margin. Now,
you'll have two graphic for the left and right side. Using CSS, set the
body background to the left side image, horizontal position to left and
repeat y-axis. Create the container div, but set the width to 100% so it
will adjust to screen size. Using CSS, set the background of the container
div to the right side image, horizontal position to right and repeat y-axis.
I haven't tried it, so I'm not sure how that would work? I was just
thinking out loud, but it's something to try.

Let me know if it works. Hope that helps.
-D-



"Lossed" <blankemail@hotmail.com> wrote in message
news:ci0clg$ca9$1@forums.macromedia.com...
> Hi, tks for this. It's certainly an option I'll use if have to, although I
> was hoping for a solution that would not restrict me to a fixed width. Is

it
> just not possible?
>
> "-D-" <noone@nospam.com> wrote in message
> news:ci0bdi$bfk$1@forums.macromedia.com...
hold[color=darkred]
on[color=darkred]
the[color=darkred]
Only[color=darkred]
a[color=darkred]
>
>



Lossed

2004-09-12, 4:14 am

hooray, that works a treat. Tks very much D.
To me, CSS is a dense forest where I can't see the wood for the trees :-)

"-D-" <noone@nospam.com> wrote in message
news:ci0eb3$dc2$1@forums.macromedia.com...
> Just as a quick follow-up. Each of the two graphics will only be about 25
> to 50 pixels width depending on how wide you want the blue colored outside
> margin to be.
>
> -D-
>
>
> "-D-" <noone@nospam.com> wrote in message
> news:ci0e64$dar$1@forums.macromedia.com...
> includes
> Now,
> container
> y-axis.
> I
> Is
> create
> say
> the
> or
>
>



-D-

2004-09-12, 4:14 am

You're welcome! Glad to hear it worked. I'll have to remember that one as
well for future use:)
-D-


"Lossed" <blankemail@hotmail.com> wrote in message
news:ci0fjg$e4e$1@forums.macromedia.com...
> hooray, that works a treat. Tks very much D.
> To me, CSS is a dense forest where I can't see the wood for the trees :-)
>
> "-D-" <noone@nospam.com> wrote in message
> news:ci0eb3$dc2$1@forums.macromedia.com...
25[color=darkred]
outside[color=darkred]
the[color=darkred]
it[color=darkred]
width.[color=darkred]
will[color=darkred]
small[color=darkred]
be[color=darkred]
Create[color=darkred]
the[color=darkred]
beyond[color=darkred]
height.[color=darkred]
divs,[color=darkred]
>
>



Lossed

2004-09-12, 7:14 am

Hi there, well, I thought it worked, and it does in IE on PC but I still
have the same problem in firefox on PC.
I put the left fade as the background to the body and that works perfect.
But the right fade, as the background to the wrapper, only goes as far as
the bottom of the viewport, in firefox. In IE it goes to the bottom of the
page - the bottom of the wrapper. I have set the wrapper to height: 100% so
thought it would extend to fill the body, with the body and the html also
set to height: 100%.

"-D-" <noone@nospam.com> wrote in message
news:ci0ge4$eop$1@forums.macromedia.com...
> You're welcome! Glad to hear it worked. I'll have to remember that one
> as
> well for future use:)
> -D-
>
>
> "Lossed" <blankemail@hotmail.com> wrote in message
> news:ci0fjg$e4e$1@forums.macromedia.com...
> 25
> outside
> the
> it
> width.
> will
> small
> be
> Create
> the
> beyond
> height.
> divs,
>
>



Gordon

2004-09-12, 7:14 am

Lossed wrote:

> Hi there, well, I thought it worked, and it does in IE on PC but I still
> have the same problem in firefox on PC.
> I put the left fade as the background to the body and that works perfect.
> But the right fade, as the background to the wrapper, only goes as far as
> the bottom of the viewport, in firefox. In IE it goes to the bottom of the
> page - the bottom of the wrapper. I have set the wrapper to height: 100% so
> thought it would extend to fill the body, with the body and the html also
> set to height: 100%.


Look at this example I made for you:

http://gordonmac.com/forums/fadedown/

Hope that helps.


--
Gordon M

My site: http://gordonmac.com/

Ein narr kann mehr fragen stellen als sieben weise beantworten können
Lossed

2004-09-13, 4:14 am

Hi Gordon,

Tks for this info. I was hoping to not have a fixed width table - I'm a
sucker for punishment :-)
If there is a way to keep the table percentage based but still somehow tack
the left and right fade images to the sides of it, that would be good. As
the table is used primarily to help force the footer to the bottom of
greater of page or viewport, and as such won't have too many rows/cells. i
guess i could apply a bg image aligned to the left or right of each row. I
haven't tried that yet but will later on.

Tks for your time,
Lossed

"Gordon" <gordonmac.com@XXXXXXXXXX> wrote in message
news:ci17di$3a7$1@forums.macromedia.com...
> Lossed wrote:
>
>
> Look at this example I made for you:
>
> http://gordonmac.com/forums/fadedown/
>
> Hope that helps.
>
>
> --
> Gordon M
>
> My site: http://gordonmac.com/
>
> Ein narr kann mehr fragen stellen als sieben weise beantworten können



Lossed

2004-09-13, 4:14 am

Tried and it works well in both ie and ff if I shove the bg image into the
table's left and right cells.

"Lossed" <blankemail@hotmail.com> wrote in message
news:ci2lfp$8oq$1@forums.macromedia.com...
> Hi Gordon,
>
> Tks for this info. I was hoping to not have a fixed width table - I'm a
> sucker for punishment :-)
> If there is a way to keep the table percentage based but still somehow
> tack the left and right fade images to the sides of it, that would be
> good. As the table is used primarily to help force the footer to the
> bottom of greater of page or viewport, and as such won't have too many
> rows/cells. i guess i could apply a bg image aligned to the left or right
> of each row. I haven't tried that yet but will later on.
>
> Tks for your time,
> Lossed
>
> "Gordon" <gordonmac.com@XXXXXXXXXX> wrote in message
> news:ci17di$3a7$1@forums.macromedia.com...
>
>



Sponsored Links


Copyright 2003 - 2009 forum4designers.com  Software forum  Computer Hardware reviews