arnolfo Posted January 29, 2010 Report Share Posted January 29, 2010 Please advise.... I have a div container with div class elements inside. The div "contentbox" has a bkgd image and is set to 100% depth of the parent container div. Inside is a with a background image of the bottom of the box. How can I force this div to sit on the bottom of the "contentbox" div? I've tried many routes that lead me to much frustration. The page is not yet live. Look for # This is the html: This is the Css #gutofitall #contentbox { background-image: url(images/images/textbox_02.gif); background-repeat: repeat-y; background-position: left top; width: 594px; margin-right: auto; margin-left: auto; font-family: Arial, Helvetica, sans-serif; font-size: small; color: #585858; line-height: 110%; text-align: left; margin-bottom: 30px; height: 100%; } #gutofitall #contentbox .top { background-image: url(images/images/textbox_01.gif); background-repeat: no-repeat; background-position: left top; height: 20px; width: 100%; } #gutofitall #contentbox .bottom { background-image: url(images/images/textbox_04_04.gif); background-repeat: no-repeat; height: 40px; position: relative; clear: both; } #gutofitall #contentbox p { margin-left: 180px; margin-right: 30px; margin-top: 0px; } #gutofitall #contentbox .name { margin-left: 30px; width: 150px; float: left; } #gutofitall #contentbox .cornergraphic { } #contentbox .cornergraphic span { background-image: url(images/gear.gif); display: block; background-repeat: no-repeat; background-position: right center; position: relative; height: 90px; float: right; width: 80px; right: 10px; bottom: 100px; } Many thanks... asdfsadfasdfasdfasfsdf asdfasfasdfaasdfasdf asdfasdfasdfasfasfsaf asdfsadfasdfasdfasfsdf asdfasfasdfaasdfasdf asdfasdfasdfasfasfsaf asdfsadfasdfasdfasfsdf asdfasfasdfaasdfasdf asdfasdfasdfasfasfsaf asdfasdfasfasdfasdfasf asdfasdfasdfasfasfsaf asdfasdfasfasdfasdfasf asdfasdfasdfasfasfsaf asdfasdfasfasdfasdfasf asdfasdfasdfasfasfsaf asdfasdfasfasdfasdfasf Quote Link to comment Share on other sites More sharing options...
Andrea Posted January 29, 2010 Report Share Posted January 29, 2010 You're missing a closing div tag in your html, and what you see will depend on where you put it. I added it to the end of the code, and just put some color and content to some of your divs so we can see them, and the footer is at the bottom: http://www.aandbwebdesign.com/misc/div.html Or is that not what you were trying to say? Quote Link to comment Share on other sites More sharing options...
arnolfo Posted January 29, 2010 Author Report Share Posted January 29, 2010 Andrea, Thank you for responding, your assistance is greatly appreciated. Yes, I see i must have not copied over the last . Your example is just what I am trying to accomplish. However I have a background graphic in my .bottom. You wrote a new .bottom class just below my .bottom class. So, I deleted my class and added in the background to your class. I also looked over my html and found it the same as your html. However my bottom box is still above the bottom by about 30 pixels. The "content box" contains a background that repeats to the bottom. It also has a 30 px bottom margin. Would this be the cause of the gap? I added a few more lines of dummy copy (actual copy yet to arrive from writer) and the bottom did drop to the bottom. If I add too much (or if the user increases the font size in browser) the bottom falls off. So, maybe the "content box" needs to be set as "Auto" and not 100% height? I am wondering if I use a and not a for the footer just outside and below the "content box" Maybe this will give me more control? Please let me know what you think. I do not wish to take too much of your time, so I'll limit my questions to this last round. Thanks again, Andrea. a Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.