Hi


I need to position the <Div id="king"> within my header ?


I know I should know how to do this, but I'm struggling.


<div id="wrapper2">
<div id="header">
<div id="navigation">
<div id="kings"><img src="kingsofleon.jpg" alt="itunes" width="248" height="140" border="0" /></div>
</div>
I need the "king" div to sit right of center. Currently I have:
#navigation
{
clear: both;
width: 100%;
background: #ffffff url('images/navheader1.jpg') no-repeat top;
height: 230px;
}
#kings {
position:absolute;
width:261px;
height:144px;
z-index:1;
text-align:center;
top:29px;
}
If I add left:740px; it sits where I want it but only on the 1268 res screen.


Basically I need to position it inside the header tag rather than on the screen, but if I use say left: it does it from the far left of the screen?


Ashley

The first thing you need to do is get rid of that position:absolute, it's not necessary.

Set position:relative on #wrapper2.

Your #header is set to a zero height - how do you expect anything to fit inside of zero ? It's also not necessary to float #header since it fills the entire width of #wrapper2.

You have no dimension on #kings. If you float an element, it MUST have a defined width. I would just float #kings left and give it a left margin to push it over where you want it.

In addition, #wrapper is not containing anything and neither is #header because your floats are not properly cleared.

thanks

Ok I've got rid of #header because frankly I only put it in to try and sort out this issue.

The #kings does have dimensions i.e. width:261px; height:144px; I made sure of that so I could float it.

Anyway changing the positive to relative, and getting rid of the header tags has help though now I have a big gap ?

ARGGHGHHGH

Actually now the navigation has disppeared all together in IE7 ?

You'll have to re-post the link to the site so we can see it.