Splitting banner

[Kevve]

So, I decided to split the banner I use on my website, so that I could use my login box in the right corner of it, making it so only the left text on the banner is clickable.

So I got the first part

<tr>
<td width="304"><a href="index.php"><img border="0" src="images/banner_01.png"></a></td>
</tr>

in header.php, nothing special. But to the other part (part 2) I can't seem to even make it show on my webpage.

I am using

.banner {
background:url("images/banner_02.png") ;
height:125px;
left:304px;
margin:auto;
width:690px;
}

in style.css and

<div id="banner">
</div>

in header.php.

I have no idea what to do next, I have tried basically everything.

[lammert]

Hi Kevve, first of all Welcome to WebmasterWorld!

The CSS code

.banner

indicates a class, but in

<div id="banner">

you specified an ID. You should either change the CSS definition to use

#banner

, or use

class="banner"

instead of

id="banner"

.

[Kevve]

Thank you. That was something I hadn't noticed. :D

Now my problem is the positioning of the banner. It seems as it has stickied at the top left of the page, instead of where I should have told it to be. Which is 304 pixels after the page itself starts. i.e where the background ends.

[Edit] I managed to get it to the top middle using no-repeat, but I don't want it in the middle, I want it a few more pixels to the right. I also want to get it down a bit so it fits with my banner, and for that I could use top: but as I have never used it before I really don't know how it works in that matter.

[Kevve]

This is solved. Thanks for all help. :D