HELP again (will pay 100NP) Align 2 Div tags side by side = looks fine in FF not IE

[davideo7]

Problem fixed by evtimii - Offer Closed

I have a website and the 2 boxes at the bottom of the page are suppose to be side by side and they are in Firefox but they aren't in Internet Explorer

http://www.mybiblegames.com/

Below is the CSS code. Also attached is an image showing how it displays in IE7.

I will pay 100 NP to anyone who can help me get this fixed.

@charset "utf-8";
/* CSS Document */
 
* {
                margin: 0 auto;
}
 
html{
height:100%;
}
 
body{
        background-image:url('images/background.png');
        background-position:center;
        background-attachment:fixed;
        text-align:center;
        background-position:bottom;
        vertical-align:top;
        border:none;
        border-width:0;
        margin:0;
        padding:0;
        margin-top:0;
        font-family:Arial, Helvetica, sans-serif;
        font-size:14px;
        height:100%;
                margin: 0 auto;
}
 
.wrapper {
        min-height: 100%;
        height: auto !important;
        height: 100%;
        margin: 0 auto -38px; /* the bottom margin is the negative value of the footer's height */
}
 
 
.siteFrame{
        border:none;
        border-width:0;
        width:764px;
        padding:0;
        text-align:left;
        margin-top:0;
        margin-left:0;
        margin-right:0;
        background-image:url('images/header.jpg');
        background-position:top;
        background-repeat:no-repeat;
        background-color:white;
        margin: 0 auto;
}
 
 
 
/* Links */
a{
        color:#b0a310;
        font-weight:bold;
        text-decoration:underline;
}
a:hover{
        color:#7e896e;
        text-decoration:overline underline;
}
a:active{
        color:#426ae1;
        text-decoration:none;
}
a:visited{
        color:#897f0c;
}
 
 
 
/* Formated Text */
.contentSmallTitle{
        font-size:12px; 
        font-weight:bold; 
        color:white;
}
 
 
 
/* A content Box that fills the entire page horizontally */
.contentBox{
        background-image:url('images/contentBorder.png'); 
        width:754px;
}
.contentBoxInside{
        background-color:white; 
        width:740px; 
        text-align:left; 
        padding:4px;
}
.contentBoxShadow{
        width:754px; 
        height:8px; 
        background-image:url('images/contentBorderShadowBottom.gif'); 
        background-repeat:repeat-x;
}
.bibleVerse{
        font-family:"Times New Roman", Times, serif;
        font-size:14px;
        text-align:center;
}
 
 
 
/* A divided Content Box */
.divContentBox{
        width:764px;
}
.divLeftBox{
        margin: 0 0 0 5px; 
        float:left;
}
.divLeftBoxBorder{
        background-image:url('images/contentBorder.png'); 
        width:374px;
}
.divLeftBoxInside{
        background-color:white; 
        width:360px; 
        height:262px; 
        text-align:left; 
        padding:4px;
}
.divLeftBoxShadow{
        width:374px; 
        height:8px; 
        background-image:url('images/contentBorderShadowBottom.gif'); 
        background-repeat:repeat-x;
}
.divRightBox{
        margin: 0 0 0 381px;
}
.divRightBoxBorder{
        background-image:url('images/contentBorder.png'); 
        background-position:right; width:374px;
}
.divRightBoxInsideNonPadded{
        background-color:white; 
        width:368px; 
        text-align:left;
}
.divRightBoxInside{
        background-color:white; 
        width:360px; 
        text-align:left; 
        padding:4px;
}
 
.divRightBoxShadow{
        width:374px; 
        height:8px; 
        background-image:url('images/contentBorderShadowBottom.gif'); 
        background-repeat:repeat-x;
}
 
 
/* Footer Related */
.footer{
        background-position:bottom;
        width:764px; 
        background-image:url('images/footerBackground.gif');
        background-repeat:repeat-x;
        height:38px;
        color:#cccbe7;
        font-size:12px; 
        vertical-align:bottom;
        line-height:1;
        margin: 0 auto;
}
.push {
        height: 38px; /* .push must be the same height as .footer */
}
a.footerLinks{
        color:#e0ddc0;
        font-weight:bold;
        text-decoration:none;
}
a:hover.footerLinks{
        color:#c0c2e0;
        text-decoration:none;
}

 

[evtimii]

The problem could be in the floating:

.divLeftBox{
margin: 0 0 0 5px;
float:left;
}

^^ here you have float


Where's your right float here?

.divRightBox{
margin: 0 0 0 381px;
}

I can't be sure until I see the whole page code.

 

[davideo7]

I tried placing a right float in the right div box but it didn't make a difference.

 

[Cyrus_vtn]

it wouldn't, the fact is you don't need it.

 

[davideo7]

evtimii, thru PM's and Messenger, has helped me fix the problem.

Offer is closed. Thanks for everyone who helped out.