Why is this different in IE and Firefox??

[d0cpaul]

For some reason my header is showing up differently in both Internet Explorer and Firefox... I want my header to be the same size as my forum... but some of the codes aren't stretching out the header in Firefox... any ideas? I included a thumbnail at the bottom too.

Here is my css

/* ***** Custom CSS for Header and Featured Articles ***** */

.OuterWrapper{
 min-width:984px;
 margin:0 auto;
 overflow:hidden;
 }
.topMain{
 background:#fff;
 min-width:984px;
 float:left;
 *padding-bottom:8px
 }
.topWrapper{
 min-width:984px;
 float:left;
 }
.topAdd{
 float:left;
 padding:5px 0 5px 5px;
 }
.googleSearch{
 float:right;
 padding:5px 28px 72px 0;
 }

.loanWrapper{
 min-width:984px;
 float:left;
 background:url(http://www.loansafe.org/blog/images/blueBg.jpg) repeat-x;
 height:92px;
 }

.logo{
 float:left;
 padding:16px 0 0 12px;
 }

.topColumns{
 min-width:556px;
 float:right;
 padding:20px 9px 0 0;
 }

.column{
 min-width:185px;
 float:left;
 }

.columnImg{float:left;}

.columnText {
        float:left;
        width:110px;
        padding:0 5px 0 10px;
        color:#fff;
        font-family:Verdana, Arial, Helvetica, sans-serif;
        font-size:11px;
        line-height:13px;
        }

.column a {
	color: #ffffff;
        font-family:Verdana, Arial, Helvetica, sans-serif;
        font-size:11px;
        line-height:13px;
	text-decoration: none;
	}

.column a:visited {
	color: #ffffff;
	text-decoration: none;
	}

.column a:hover {
	color: #ffffff;
	text-decoration: underline;
	}


.topNav{
 min-width:984px;
 float:left;
 }

.nav{
 min-width:984px;
 float:left;
 background:url(images/navBg.jpg) repeat-x;
 height:26px;
 }

#pagebar {

    background: #527db0;
    min-width: 980px;
    height:15px;
    color: #ffffff;
    font-size: 11px;
    font-family: Arial, san-serif;
    margin: 0px auto 10px;
    padding: 8px 10px 8px 10px;
    overflow: hidden;
    border-top: 1px solid #5B80FF;
    }

.pagebar-left {
    min-width: 450px;
    text-align: left;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    float: left;
    }

#footer {
        min-width: 960px;

I also attached thumbnails of both FF and IE.

[KevinL]

Why do you have all different widths defined?

[eSekar]

Just visited your site with FF, IE8 & IE7, Looks fine in all of them.

[d0cpaul]

Originally Posted by KevinL

Why do you have all different widths defined?

Because they are different section of the header?

Originally Posted by eSekar

Just visited your site with FF, IE8 & IE7, Looks fine in all of them.

Yeah I had to change it back because there were too many people in the forum to leave it messed up like that but you will be able to see the difference at 5PM PST when I'm working on it.



The reason why I am trying to make it bigger is because certain sections of my forum are being cut off because there are too many pages... let me give you an example...

http://www.loansafe.org/forum/stop-f...us-your-story/

If you look at this part of the forum the last 10% of the page is being cut off... Here is a thumbnail so you can see what I'm talking about...

I can't reduce the amount of the pages because I would be deleting precious content... any ideas?