Thank for the reply, but it's not quite there yet.
The header image is now where I want it, but it's come at the expense of the top right corner graphic which comes from the "main_block.png" file. I can't seem to have both files "live" in the code, else the whole header looks a mess.
At the moment I can either have a header and a missing top right corner with this code:
body {
background: #d00000;
font-family : Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color : Black;
margin: 0px;
padding-top: 10px;
padding-right: 5%;
padding-bottom: 15px;
padding-left: 5%;
}
#cpg_logo_block_outer {
background-image: url(images/main_block.png);
background-repeat: no-repeat;
background-attachment: scroll;
background-position: 0pt -240px;
padding-left: 10px;
}
#cpg_logo_block_outer div.cpg_logo_block_inner {
background-color: transparent;
background-image: url(images/header_random_1.png);
[b]// background-image: url(images/main_block.png);[/b]
background-repeat: no-repeat;
background-attachment: scroll;
[b]// background-position: 100% -240px;[/b]
display: block;
padding-top: 110px;
padding-right: 20px;
padding-bottom: 0px;
padding-left: 0px;
}
#cpg_logo_block_logo {
float: center;
border: none;
}
#cpg_logo_block_name {
float: right;
text-align: center;
OR
I can have the border but no header graphic with this code:
body {
background: #d00000;
font-family : Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color : Black;
margin: 0px;
padding-top: 10px;
padding-right: 5%;
padding-bottom: 15px;
padding-left: 5%;
}
#cpg_logo_block_outer {
background-image: url(images/main_block.png);
background-repeat: no-repeat;
background-attachment: scroll;
background-position: 0pt -240px;
padding-left: 10px;
}
#cpg_logo_block_outer div.cpg_logo_block_inner {
background-color: transparent;
background-image: url(images/header_random_1.png);
background-image: url(images/main_block.png);
background-repeat: no-repeat;
background-attachment: scroll;
background-position: 100% -240px;
display: block;
padding-top: 110px;
padding-right: 20px;
padding-bottom: 0px;
padding-left: 0px;
}
#cpg_logo_block_logo {
float: center;
border: none;
}
#cpg_logo_block_name {
float: right;
text-align: center;
It appears that the "main_block.png" image needs the "background-position:" values in order to line up correctly, but these values then throw the "header_random_1.png" off the screen.
How can I get both of the images to display corectly?
Thanks again.
Martin