Browser compatibility(IE & FF) problems in DIVS

Hi Experts,

I designed 4 pages for my hosting blog & having some browser issues(specially IE7). I am trying to fix these issues from the last 4 days but still unsuccessful :(
Please let me know how I can fix these issues. Also guide me with your valuable advices that how I can stop such issues in future. You can see this live here... www.uzairusman.com/mtd (http://www.uzairusman.com/mtd/)

Below is the list of problems I am getting on IE7...

GENERAL PROBLEMS IN ALL PAGES
=============================
1. Look at the right corner of top min menu. the background image is repeating itself below the right corner image. It should

not be visible below the corner image.

2. The footer copyright notes etc. This text touches the bottom line in IE7.

3. IE7 is not showing the bottom margin of wrapper div.

PROBLEMS IN LANDING.HTML
========================
1. The top white banner saying "Blog Hosting" in red color is not looking fine in IE7. Its top & bottom sections are having

some blank space & causing the problem.

2. The footer section of this page is also the same as other pages but don't know why its not looking like them. The

background image is far away from the left & right corner images.

Is the display OK in Firefox?

Yes sir,

Its looking alright in Firefox. Please help me fixing this in IE.

Regards,
Uzair

You sure the display is OK in firefox it looks a little odd, but fine when i switch to my IE tab view

General Problem 1:

#topmenu
{
height: 56px;
overflow: hidden;
}

General Problem #3:

<div class="clear" style="height:0px;"></div>

Add that style attribute to the div at the bottom of your #wrapper.

General Problem #2:

#footer
{
height: 85px; /*height of your image*/
}


Also, same as in the #3 solution, you need to add style="height:0px;" to that <div class="clear" /> right above:

</div><p><strong>Tel:

Landing Problem #1

You need to wrap your imgs that are under 8px in something like this:

<div style="height:7px;overflow:hidden;"><img src="http://www.uzairusman.com/mtd/images/landing_bannerImgBtm.gif" width="862" height="7" border="0" alt="" /></div>


That will fix your spacing issue.

Hi,

All worked fine, thank you very much. I have uploaded the updated files. But...Landing problem #2 still exists. Can you see that again?

Regards

You have another issue noe in FF (doesn't show in IE) below the footer of your page. Looks like img ftr_rt.gif is getting pushed down.

If you have time, I strongly recommend re-doing some of the html backgrounds/borders with CSS rather than floated img tags.