i’ve been reading stuff like crazy but when it gets to putting it in use i have no clue what to do i swear…

ok so heres my problem
i’m making the header of my webpage out of 3 images
there will be on to the left, one centered in the middle, and one to the right
however, the ones to the left and the right are both going to fill up 50% of the horizontal screen, so in essence filling the header, and my image centered in the middle will be on top of them.

i’ve gotten it how i want it to be, but the image i wan’t centered isn’t centered, its more at the right. everything i try just seems to mess it up worse, which is irritating because i’m sure its simple…

heres the related code

HTML

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <title>My Paintball Gear - Home</title>
    <link rel="stylesheet" type="text/css" href="paintballcss.css">
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
</head>
<body>
    <div id="header"> 
        <img src="blackfade.png"  alt="fade" id="floatleft" >
        <img src="blackfaderight.png" alt="fade" id="floatright" >
        <img src="header.gif"  alt="My Paintball Gear - The Gear of a Champion" id="name" >
    </div>

CSS

Code:
div#header {
    border-top: 4px solid black;
    border-bottom: 4px solid black;
    width: 100%;
    height: 100px;
}
img#floatleft {
    float: left;
    height:100%;
    width: 50%;
}
img#floatright {
    float: right;
    height:100%;
    width: 50%;
}
img#name {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

img#floatright should be on the right
img#floatleft on the left
img#name in the center <— this is the only thing messed up, its to the right

ty

30,000 Mb And Unlimited Bandwidth Only $3.75/mo.


Go Daddy $6.95 .com sale 468x60

Powered By: BigInfo.org