Making my "float" box fill all the way to bottom of page |
Making my "float" box fill all the way to bottom of page |
SeanWoods |
Apr 23 2009, 10:04 PM
Post
#1
|
Member Group: Members Posts: 42 Joined: 23-March 09 Member No.: 8,142 |
If you look at my page: Index Page the gray box along the left side stops short of going all the way to the bottom of the page. I made this box a left floating box and the text on the right is in it's own right floating box. How do I make the height of the left box match the height of the right box so the gray goes all the way to the bottom?
CODE #wrapper { width: 800px; text-align: left; border-top-style: none; border-right-style: solid; border-bottom-style: none; border-left-style: none; background-color: #FFFFFF; border-right-width: 1px; border-right-color: #999999; margin-top: auto; margin-right: auto; margin-bottom: auto; margin-left: auto; } #navigation { height: 20px; text-align: center; margin-bottom: 15px; } #wrapper #bodyArea #left { width: 120px; float: left; background-color: #CCCCCC; border-top-width: 1px; border-top-style: solid; border-top-color: #999999; display: block; border-right-width: 1px; border-right-style: none; border-right-color: #999999; padding-top: 0px; padding-right: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; border-left-style: none; } #wrapper #bodyArea { border-left-width: 1px; border-left-style: solid; border-left-color: #999999; background-position: center; width: 799px; clear: both; } #wrapper #bodyArea #right { width: 679px; float: right; padding: 0px; border-top-width: 1px; border-top-style: solid; border-right-style: none; border-bottom-style: none; border-left-style: none; border-top-color: #999999; text-align: justify; border-left-width: 1px; border-left-color: #999999; clear: right; margin-top: 0px; } #wrapper #bodyArea #footer { height: 55px; clear: both; background-color: #CCCCCC; border-right-style: none; border-bottom-style: solid; border-bottom-width: 1px; border-bottom-color: #999999; text-align: center; background-position: center; border-top-width: 1px; border-top-style: solid; border-top-color: #999999; border-left-style: none; } |
pandy |
Apr 23 2009, 10:13 PM
Post
#2
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
See some solutions here.
http://css-discuss.incutio.com/?page=AnyColumnLongest |
SeanWoods |
Apr 28 2009, 07:45 PM
Post
#3
|
Member Group: Members Posts: 42 Joined: 23-March 09 Member No.: 8,142 |
Thanks! Problem solved! |
Lo-Fi Version | Time is now: 23rd April 2024 - 03:37 PM |