Positioning Issues in IE

[OAFC_Rob]

Hey,I'm having some positioning issues in IE, but not in firefox please see the attached images. The firefox is what I want it to look like, any idea how to fix it, see the CSS below;                                                         

@charset "utf-8";
/* 
CSS DOCUMENT FOR INNOVATIONATION UK BY ROBERT ROSEBURY

** NOTE . = CLASS AND # = ID  ** 
        ** NOTE PADDING / MARGIN: TOP RIGHT BOTTOM LEFT;

*/

/* BACKGROUND / GENERAL CSS STYLINGS */

body
{
    background: url('../images/container/03.png') repeat-x top #DADADA;
    padding: 0px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    margin: auto;
    color: #0d294f;
}

    /* PAGE / VIEW CONTAINER */	

    #viewContainer
    {
        width: 960px;
        height: auto;
        margin: auto;
        padding: 0px;
        
    }

        /* HEADER CONTAINER */		

#headerContent
        {
            color: #0d294f;
            width: 960px;
            margin: 25px auto auto auto;
        }
            
            /* LOGO CONTENT */	
            
            .logoContent
            {
                color: #66ffff;   
            }
            
        /* MAIN CONTENT */

.mainContent
        {
            margin: 25px auto 25px auto;
        }
            /* COLMUNS / PARAGRAPH SECTIONS */
            .paraBlockLeft
            {
                float: left;
                width: 640px;
            }
                .leftTop
                {
                    background: url('../images/container/04.png') no-repeat top;
                    height: 25px;
                }
                .leftMiddle
                {
                    background: #FFFFFF;
                    border-left: 1px solid #010101;
                    border-right: 1px solid #010101;
                    height: 105px;
                }
                .leftBottom
                {
                    background: url('../images/container/05.png') no-repeat bottom;
                    height: 25px;
                }
            .paraBlockRightTop
            {
                float: right;
                width: 310px;
            }
            .paraBlockRightBottom
            {
                float: right;
                width: 310px;
            }
                .rightTop
                {
                    background: url('../images/container/06.png') no-repeat top;
                    height: 25px;
                }
                .rightTopSecond
                {
                    background: url('../images/container/06.png') no-repeat top;
                    height: 25px;
                    margin-top: 25px;
                }
                .rightMiddle
                {
                    background: #FFFFFF;
                    border-left: 1px solid #010101;
                    border-right: 1px solid #010101;
                }
                .rightBottom
                {
                    background: url('../images/container/07.png') no-repeat bottom;
                    height: 25px;
                }
                
.clearArea
        {
            clear: both;
        }
        .fullWidthContent
        {
            width: 960px;
        }
            .fullWidthTop
            {
                background: url('../images/container/08.png') no-repeat top;
                height: 25px; 
                margin-top: 25px;
            }
            .fullWidthMiddle
            {
               background: #FFFFFF;
               border-left: 1px solid #010101;
               border-right: 1px solid #010101; 
            }
            .fullWidthBottom
            {
               background: url('../images/container/09.png') no-repeat bottom;
               height: 25px;  
            }
             
        /* LEFT FOOTER CONTENT - COPYRIGHT */
        .leftFooter
        {
            float: left;
            background: #FFFFFF;
            margin-left: 30px;
            margin-top: -5px;
            color: #666666;
            cursor: default;
            font-size: 10px; 
            width: 330px;
        }

        /* RIGHT FOOTER CONTENT  - ADMIN LINKS */
        .rightFooter
        {
            float:right;
            background: #FFFFFF;
            margin-right: 40px;
            margin-top: -5px;
            font-size: 10px;
            width: 385px;
            display: inline;
        }

 

[attachment deleted by admin]

[OAFC_Rob]

Here is the firefox image

 

[attachment deleted by admin]

[cssfreakie]

I don't have to look at the code to guess that your missing something which is at the number 1 spot in the sticky of this thread.

Your missing a (valid) Doctype.

 

So as stated in the sticky please read that.

[OAFC_Rob]

<!-- DATABASE CONNECTION TO GO HERE -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<title>
    		Innovationation UK | Website Development | Bespoke Websites | Robert Rosebury 
    	</title>
    
            <!-- META DATA -->
            <meta http-equiv="Content-Type" content="text/html; charset=windows-1252" />
            <meta name="keywords" content=""/>
            <meta name="description" content ="" />

            <!-- SHORTCUT IMAGE -->
            <link rel="shortcut icon" href="<?php $_SERVER["DOCUMENT_ROOT"] ?>/innovationation1/commonResources/images/container/favicon.ico" />

            <!-- MAIN CSS FILE -->
            <link rel="stylesheet" type="text/css" href="<?php $_SERVER["DOCUMENT_ROOT"] ?>/innovationation1/commonResources/css/style.css" />


            <!-- PUT COMMON JAVASCRIPT FILES IN AN INCLUDE 05/05/2011 -->
    
</head>
<body>
        <div id="viewContainer"><!--OPEN DIV FOR VIEW CONTAINER -->
        
            <div id="headerContent"><!--OPEN DIV FOR HEADER CONTENT -->
            
                <div class="logoContent"><!--OPEN DIV FOR LOGO CONTAINER -->
                
                    <a href="index.html"><img src="<?php  $_SERVER["DOCUMENT_ROOT"] ?>/innovationation1/commonResources/images/container/logo.png" alt="Innovationation Logo" longdesc="Innovationation home link" /></a>
                    
                </div><!--CLOSE DIV FOR LOGO CONTAINER -->
                
                <div class="fullWidthContent">
                    <div class="fullWidthTop">
                    </div>
                    <div class="fullWidthMiddle">
                        NAVIGATION AREA
                    </div>
                    <div class="fullWidthBottom">
                    </div>
                </div>
                
            </div><!--CLOSE DIV FOR HEADER CONTENT -->
            <div class="mainContent">
                <div class="paraBlockLeft">
                    <div class="leftTop">
                    </div>
                    <div class="leftMiddle">
                        MAIN PAGE CONTENT
                    </div>
                    <div class="leftBottom">
                    </div>
                    
                </div>
                <div class="paraBlockRightTop">
                    <div class="rightTop">
                    </div>
                    <div class="rightMiddle">
                        NEWS / BLOG AREA
                    </div>
                    <div class="rightBottom">
                    </div>
                </div>
                <div class="paraBlockRightBottom">
                    <div class="rightTopSecond">
                    </div>
                    <div class="rightMiddle">
                        ADVERTS / IMAGES / OTHER
                    </div>
                    <div class="rightBottom">
                    </div>
                </div>
            </div>
            
            <div class="clearArea"></div>
            
            <div class="fullWidthContent">
                    <div class="fullWidthTop">
                    </div>
                    <div class="fullWidthMiddle">
                         
                        <div class="leftFooter"><!--OPEN DIV FOR LEFT FOOTER-->

                            ©  <?php echo date(Y); ?> All Rights Reserved  |  Design by <a href="http://www.innovationation.co.uk/">Innovationation UK</a>

                        </div><!--CLOSE DIV FOR LEFT FOOTER-->

                        <div class="rightFooter"><!--OPEN DIV FOR RIGHT FOOTER-->

                            <a href="">Copyright | </a>
                            <a href="">Disclaimer | </a>
                            <a href="">Privacy Policy  </a>
                            <a href="">Terms of Use | </a>
                            <a href="">Site Map | </a>
                            <a href="loginArea/login.php">Admin</a>

                        </div><!--CLOSE DIV FOR RIGHT FOOTER-->
                        
                    </div>
                    <div class="fullWidthBottom">
                    </div>
            </div>
            
        </div><!--CLOSE DIV FOR VIEW CONTAINER -->
        
        </body>
</html>

[cssfreakie]

try to remove <!-- DATABASE CONNECTION TO GO HERE -->

Doctype should be the very first thing

 

And if it's not... it's still polite to response not as a computer by just pasting code. But this is the very first thing that happens someone doesn't have a working doctype. IE will go in to quirksmode.

 

If you by the way have an online example it probably would make more sense in the specific situation

[OAFC_Rob]

Cheers I forgot about that, should have been in this format instead                       

<?php #DATABASE CONNECTION TO GO HERE ?>

[cssfreakie]

Cheers I forgot about that, should have been in this format instead                       

<?php #DATABASE CONNECTION TO GO HERE ?>

 

Do you have an online example?? or did you meant with the above that it was fixed?

 

 

-edit: i guess it is, good luck with the innovation!..

[OAFC_Rob]

It's all fixed for now, the site isn't live at the moment, re-developing it as the old one sucks big time now