467,108 Members | 1,330 Online
Bytes | Developer Community
Ask Question

Home New Posts Topics Members FAQ

Post your question to a community of 467,108 developers. It's quick & easy.

Mozilla <div> problem

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
  • viewed: 1633
1 Reply
Expert 4TB
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.

Similar topics

8 posts views Thread by Daniel Hansen | last post: by
61 posts views Thread by Toby Austin | last post: by
7 posts views Thread by Dario de Judicibus | last post: by
3 posts views Thread by Josef K. | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.