By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
437,723 Members | 1,655 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 437,723 IT Pros & Developers. It's quick & easy.

Mozilla <div> problem

P: 1
I am using div#container and then some more <div>'s inside it. How do I make Mozilla recognize that the container should wrap up everything. I have a div#mainContent, which is right floating inside the div#container and has content that goes below the container. Mozilla doesn't recognize that :( so the content is just floating around unwrapped when you scroll to the bottom of the page.

Here is my two <div> elements:

#container {
font-family: Helvetica, Arial, sans-serf;
color: #FFFACD;
background-color: #8FBC8F;
width: 760px;
height: 100%;
position: relative;
margin: auto;
margin-top: -15px;
margin-bottom: 0px;
padding: 0;
text-align: left;
overflow: visible;
}

#mainContent {
display: block;
font-family: Helvetica, Arial, sans-serif;
font-size: 1.0em;
width: 500px;
height: 600px;
float: right;
padding-left: 10px;
padding-right: 10px;
margin-top: 20px;
margin-right: 40px;
}
Apr 19 '07 #1
Share this Question
Share on Google+
1 Reply


drhowarddrfine
Expert 5K+
P: 7,435
Parent elements are NOT to expand to contain floated elements so Mozilla is behaving correctly. I assume you see this happening in IE but this is an IE bug and incorrect behavior. Try changing overflow:visible to overflow:auto and see if that does what you want. Otherwise, we need to see the complete code or a link.
Apr 19 '07 #2

Post your reply

Sign in to post your reply or Sign up for a free account.