Logo appearing on wrong side of floated image

[cs.punk]

Well I'm not sure why or how it is doing this but basically my logo is appearing after my navigation links (ok link haha ;P). And I want it to appear before the link. If anyone could point me into what is causing this please do tell!

 

Thank you!

 

body {
    margin: 0;
    padding: 0;
}

div.container {

}

div.headNav {
    width: 100%;
    height: 62px;
    background-image: url("/chris_design/images/border_gray.jpg");
        margin: 0;
    padding: 0;
    clear: both;
    float: left;
}

div.nav {
    margin: 0;
    padding: 0;
    float: left;
    border: none;
    margin-left: 450px;
}


img.Nav {
    border: none;
}

a img {
    border: none;
    margin: 0;
}

 

<div class='container'>

    <div class='headNav'>
    <a href='index.php' class='navLinks'><img  class='imgNav' src="/chris_design/images/logo.jpg"/></a>
    
    <div class='nav'>
        
        <a href='index.php' class='navLinks'
            onmouseover="hoverImg('bob','imgHomeOn')"
            onmouseout="hoverImg('bob', 'imgHomeOff')" ><img name='bob' class='imgNav' src="/chris_design/images/home_off.jpg"/></a>
    </div>
    
    </div>
</div>

 

Attached is a pic of it.

 

[attachment deleted by admin]

[cssfreakie]

ADD this at the bottom of your css

I must say i don't like the look of your markup really, but that's just personal.

 

div.headNav a.navLinks img.imgNav{
    float:left;
}

 

if it doesn't work let me know

[cs.punk]

Thank you it worked a treat!

[cssfreakie]

mark it solved saves use time reading it all again