I think you might be seeing a 'failing to enclose the float' issue. Try putting "display:inline-block;" on your #an1 and #an2 divs. Or, try adding a <br /> just before the closing </div> of #mainan. Hope this helps.
Your page is looking pretty good in IE7 right now. Good work! You do have quite a few validation errors that I recommend you clean up. Having validated code goes a long way towards keeping pages looking similar by preventing the browsers from rendering in quirks mode.
True - using display: inline-block is a better fix than the adding the <br>. You can read about clearing floated items, and clearfix here. I believe that's the issue you were seeing.
Why would you put display:inline-block by itself? (Assuming this is the parent element of the floats you're targeting) Are you resetting the display property back to block? Are you feeding the inline-block to MSIE only via CC or star html hack? display:inline-block and in a seperate rule display:block makes IE retain layout on that element. There are other ways to contain floats such as overflow property with a value other than scroll or inserting an invisible period for modern browsers.. for it you just have to make the element have layout by giving it width/height/zoom/inline-block then block/ some other shit.
Ok, let's see what I can see - warning I'm going line-by-line with what I see wrong, it's usually the only way I can find an error, much less fix it. First off, you've got easily three times the number of containers and classes this layout needs. I would probably get rid of #header, #navbar, #navbar2 and .menu - NONE of those are necessary... and I'd probably change #logo to a H1 with an image replacement technique. I wouldnt' even BOTHER with the javascript for flash - all that usually does is break in SOME browser (usually opera) <br clear="all" /> - clearing break? Unneeded, unnecessary, unwarranted. You shouldn't even be needing a float for the header being a fixed width layout if you make use of a negative top margin. #maincontent, #div, #welcometext all can probably go... and I'd also axe the #photo div moving it to the image... as a class since you MIGHT use that more than once in the future, and the title is a header, so axe #weltitle and make that a h2. the 'news and announcements' text would ALSO be an H2, the text you have in bold inside those should also likely be h3's. These spacing breaks after the flash object serve no purpose I can fathom, and aren't even valid to the doctype. and on the footer you are starting a div with a line-break (that's what margin-top is for), wasting time on a center tag when you have a perfectly good ID, and seem to have the address as an anchor which doesn't really make much sense. So, to 'clean that up' I would rewrite that html to: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en"><head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>NewLife</title> <link href="screen.css" rel="stylesheet" type="text/css" media="screen,projection" /> </head><body> <div id="container"> <h1> <strong>NEW LIFE</strong> Christian Fellowship <em>Where Jesus is Lord and People are Precious</em> <span></span> </h1> <ul id="main_menu"> <li> <a href="index.php">Home</a> </li><li> <a href="pastor.php">Pastor</a> <ul> <li><a href="pastor.php">Pastor</a></li> <li><a href="fundamentals.php">Fundamentals</a></li> </ul> </li><li> <a href="#item1">Media</a> <ul> <li><a href="videos.php">Video</a></li> <li><a href="audio.php">Audio</a></li> </ul> </li><li> <a href="weekly.php">Weekly</a> </li><li> <a href="#item2">Ministries</a> <ul> <li><a href="kids.php">Kids</a></li> <li><a href="youth.php">Youth</a></li> </ul> </li><li> <a href="contact.php">Contact</a> </li> </ul> <div id="content"> <div class="welcome"> <img src="images/photo1.png" width="212" height="158" class="photo" alt="Larry and Sandra Linkous - Pastors and Founders" /> <h2>Welcome to Find New Life</h2> <p> New Life Christian Fellowship is a family of believers who believe that the Kingdom of God is a non-judgmental society that speaks dignity and esteem to every person that we meet. Jesus accepts you right where you are and so do we. You do not have to pass a religious exam to be welcome here. Jesus accepts us right where we are and loves us there. We have no right to be any other way. </p> </div> <div class="announcements"> <h2>News and Announcements</h2> <ul class="newsbanners"> <li> <a href="index.php?id=17" class="newsbanner"> <img src="https://home.bizzarx.com/newlife/newsbanners/image1.jpg" alt="banner1" /> </a> </li><li> <a href="index.php?id=16"> <img src="https://home.bizzarx.com/newlife/newsbanners/image1.jpg" alt="banner2" /> </a> </li> </ul> <ul class="recent_news"> <li> <h3><a href='index.php?id=11'>Another night of praise</a></h3> <p>Sunday, October 1 at 6pm. Learn more.</p> </li><li> <h3><a href='index.php?id=7'>Praise God, another night of praise!</a></h3> <p>Sunday, October 1 at 6pm. Learn more.</p> </li><li> <h3><a href='index.php?id=6'>Lord's night of praise!</a></h3> <p>Sunday, October 1 at 6pm. Learn more.</p> </li> </ul> <ul class="older_news"> <li> <h3><a href='index.php?id=5'>Enjoying a night of praise</a></h3> <p>Sunday, October 1 at 6pm. Learn more.</p> </li><li> <h3><a href='index.php?id=4'>Invite all to a night of praise</a></h3> <p>Sunday, October 1 at 6pm. Learn more.</p> </li><li> <h3><a href='index.php?id=3'>A night of praise</a></h3> <p>Sunday, October 1 at 6pm. Learn more.</p> </li> </ul> </div> </div> <div id="sidebar"> <object type="application/x-shockwave-flash" data="videos/video.flv" width="288" height="128"> <param name="movie" value="videos/video.flv" /> <img src="videos/video.flv" width="288" height="128" alt="video" /> </object> <a href="contact.php"><img src="images/example.png" alt="prayer_request" /></a> </div> <div id="footer"> <a href="contact.php"> 6755 South Washington Avenue | Titusville, Florida 32780 | 321-269-7578 </a><br /> E-Mail: <a href="contact.php">info@findnewlife.com</a> </div> </div> </body></html> Code (markup): That should be all the html you need - I'll toss together the CSS for that on my next break - the layout is simple enough it shouldn't take too long. GAh, except for that malfing FLV - I'd seriously convert that to SWF and avoid the bs headaches. (or just make it a download link - but then I HATE embedded flash in websites)
thanks you for all you help so what are you saying about the drop down nav? and why is the dropping down in ie6
Ok, this is how I'd code the layout - sans the flash. You can add that back in. I like to pull that stuff out to eliminate it as a possible cause of layout issues. I'm not certain what was pushing down your version, but I think you'll find this one is better. http://battletech.hopto.org/for_others/freeflashgames/template.html The directory: http://battletech.hopto.org/for_others/freeflashgames is unlocked so you can grab the bits and pieces. I added the 'csshover2.htc' from PeterNed http://www.xs4all.nl/~peterned/csshover.html which implements :hover and :focus in IE 6 and earlier. If I have time tomorrow I can go through it line by line for you to explain the choices that were made. Validates XHTML 1.0 Strict, tested working in IE 6 & 7, FF, Opera and Safari. IE 5.x will not work due to the mixing of some widths with padding/margins - that can be hacked around if you care about IE5 (I don't anymore) Oh, and if you are scratching your head over the h1 - the span is the image... The rest of it, well... turn images off
deathshadow thank you so much i would like hire you to do some more stuff on the same site i think the hole site need to be fixed. if you are interested AIM me