Click to See Complete Forum and Search --> : Need help with overlapping divs in FF


blade52x
06-17-2007, 11:52 AM
I made a div in the css with the following properties:

navbar.php
#navbar {display:block; float:left; width:164px; height:500px; border-bottom: 1px solid rgb(0,0,0); border-right:1px solid rgb(0,0,0)}

As you can tell it's my left nav bar. Now, I made another div on a separate php page which is supposed to show the information in the available space to the right of this nav bar.

main.php
#recent {margin:10px 10px 10px 10px; width:550px; height:200px; border:2px solid rgb(0,91,168)}

The problem is, the div #recent is overlapping #navbar in FF. In IE it displays to the right. I would just center #recent, but it would not center the same in both browsers since the margins for #recent are different in each one.

How can I fix this overlapping problem? Thanks.

WebJoel
06-17-2007, 02:56 PM
I would trust that Fx is showing this to your correctly, and IE showing it to you incorrectly (albeit, the way you expected & wanted it to look).

Is this hosted online? I'd to view it for real.

thamba
06-17-2007, 03:33 PM
Use float:left property for the #recent div also. That should help.

WebJoel
06-18-2007, 09:28 AM
Via private e-mail, I got to view the page source and found a lot of "<style> this:that {} etc etc </style>" in the BODY (in DIVs), which is incorrect. It's not 'inline CSS' the way it was done. All "<style></style>" must be in the HEAD (before the "</head>").
When this is fixed, maybe things will work better.

I tried doing it but there are some other issues I can't quite understand, so leaving it up to OP to get <STYLE> before </HEAD> and report back. :)

blade52x
06-18-2007, 03:05 PM
I moved it all and it now validates (xhtml) but I still had the problem.

I just had float:left working fine and all of a sudden it's not working anymore after I was playing around with it. :mad:

Edit: I must be seeing things because I could have swore I had the same thing and all of a sudden it works again. Maybe I need some sleep. :o

Oh and thanks for the tips through PM Joel. (though I can't seem to make the change without some things getting thrown around)

jayanagi
06-18-2007, 04:20 PM
12

WebJoel
06-19-2007, 06:22 PM
If we could see the whole code, it would be helpful. :)