This content has been marked as final.
Show 13 replies
-
1. Re: Making div height 100%
Newsgroup_User Nov 26, 2008 10:30 AM (in response to Stuart Haiz)> How can I get the div#sideBar to always be 100% height of the div#middle?
You don't without some JS trickery that I think is more trouble than it's
worth. Google "faux columns" for a better, cleaner approach.
--
Walt
"Sirius7" <webforumsuser@macromedia.com> wrote in message
news:ggk0eo$68o$1@forums.macromedia.com...
> I've looked at some of the posts on the forum about this issue & can't
> work out
> where I'm going wrong....
>
> On this page http://www.designermagic.co.uk/hobarts I have a #sideBar div
> with
> a pale blue background, containing some elements. The sideBar div floats
> left
> inside a div called #middle. I have tried floating #middle left (currently
> I
> have commented this out) & also tried a br class="clearfloat" before my
> sideBar div closing tag.
>
> How can I get the div#sideBar to always be 100% height of the div#middle?
>
-
2. Re: Making div height 100%
Stuart Haiz Nov 26, 2008 10:44 AM (in response to Stuart Haiz)Thank you Walt - I have just found a link over at communitymx that I'm printing off now!
http://www.communitymx.com/content/article.cfm?cid=afc58 -
3. Re: Making div height 100%
dr.moondog Nov 26, 2008 10:47 AM (in response to Stuart Haiz)I don't know if I understand You well, but try in hbpages.css to add this:
height: 100%; -
4. Re: Making div height 100%
dr.moondog Nov 26, 2008 10:47 AM (in response to Stuart Haiz)I don't know if I understand You well, but try in hbpages.css to add this:
height: 100%; -
5. Re: Making div height 100%
Stuart Haiz Nov 26, 2008 10:52 AM (in response to Stuart Haiz)I did try height: 100% but it didn't work.
Thanks for the suggestion. -
6. Re: Making div height 100%
malcster2 Nov 26, 2008 11:00 AM (in response to Stuart Haiz)set as 100% height. in your side bar, set your background as repeating y, i.e
#sidebar{
height:100%;
background-image:url(../Images/bodybackground1.jpg);
background-repeat:repeat-y;
} -
7. Re: Making div height 100%
Newsgroup_User Nov 26, 2008 12:08 PM (in response to Stuart Haiz)"malcster2" <webforumsuser@macromedia.com> wrote in message
news:ggk6bi$da6$1@forums.macromedia.com...
> set as 100% height. in your side bar, set your background as repeating y,
> i.e
>
> #sidebar{
>
> height:100%;
> background-image:url(../Images/bodybackground1.jpg);
> background-repeat:repeat-y;
> }
No.
--
Tim G.
http://www.pactumweb.com
http://www.shortordersite.com
-
8. Re: Making div height 100%
Stuart Haiz Nov 26, 2008 12:31 PM (in response to Stuart Haiz)malcster2 - I tried this with a spacer.gif but no luck. -
9. Re: Making div height 100%
malcster2 Nov 26, 2008 2:06 PM (in response to Stuart Haiz)ok, paste your code here -
10. Re: Making div height 100%
Newsgroup_User Nov 26, 2008 3:23 PM (in response to Stuart Haiz)"malcster2" <webforumsuser@macromedia.com> wrote in message
news:ggkh9t$qmg$1@forums.macromedia.com...
> ok, paste your code here
There's no code to paste. There is no way in CSS to force a div to fill 100%
of the height of its container. That requires a javascript solution. But
it's simpler simply to use faux columns via background imaging.
--
Tim G.
http://www.pactumweb.com
http://www.shortordersite.com
-
11. Re: Making div height 100%
Newsgroup_User Nov 26, 2008 3:25 PM (in response to Stuart Haiz)"Tim G" <webservicesNOSPAM@pactumgroup.com> wrote in message
news:ggklpg$2qs$1@forums.macromedia.com...
> "malcster2" <webforumsuser@macromedia.com> wrote in message
> news:ggkh9t$qmg$1@forums.macromedia.com...
>> ok, paste your code here
>
> There's no code to paste. There is no way in CSS to force a div to fill
> 100% of the height of its container. That requires a javascript solution.
> But it's simpler simply to use faux columns via background imaging.
I should say, it's *usually* simpler. Faux columns require a little more
sophistication if you're dealing with a fluid layout, although it's still
doable.
--
Tim G.
http://www.pactumweb.com
http://www.shortordersite.com
-
12. Re: Making div height 100%
malcster2 Nov 27, 2008 12:12 AM (in response to Stuart Haiz)to use a faux column, you need to style the div, i.e, in css. you don't need javascript..
if there is no styling for the #sidebar div, how can faux be applied? -
13. Re: Making div height 100%
Stuart Haiz Nov 27, 2008 1:33 AM (in response to Stuart Haiz)Using the article I linked to earlier solved the problem. It was unbelievably easy using the faux columns technique...
It DOES use a y-tiled background image, but not on my #sideBar - the #sideBar is inside another div called #middle & it is the #middle div the y-tiling image of the faux column is applied to.
The article does explain how simple it is to use percentage-based values on a graphic to work with liquid layouts too.
Thanks everyone for your input.


