Try the following:
#header {}
div#headerimg { display:block;
background:url(wp-content/themes/darkcontrast/images/Header.PNG);
margin: 7px auto;
height: 199px;
width: 739px;
border:10px solid #8c0000;
}
It’s case sensitive, note the caps (PNG). Something is wrong with the path, though. images/Header.PNG should work… Still needs aligning, etc.
Thread Starter
LL
(@ll)
Perhaps it’s in my header file? I’m trying to put together 2 or 3 themes to suit my needs and I’m doing it all with only blogger template experience. I’m not sure if I am missing code in the following.
Either way, the header image has still not appeared. Should I switch it out to a jpg and delete the png file? Then change all the url to go to the new pic?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="<?php bloginfo('stylesheet_url'); ?>" rel="stylesheet" media="screen" type="text/css" />
<title><?php bloginfo('name'); ?></title>
</head>
<div id="header">
<div id="headerimg">
</div></div>
<h1 id="title"><?php bloginfo('name'); ?></h1>
<div id="wrap">
<div id="content">
<div id="left">
The *.PNG is a pig (huge size) so you should convert to a .jpg.
I changed your style.css using the code I pasted above, and the header image appeared just fine. Make sure you are clearing your cache.
Avoid using IE for dev/design stuff, use a Modern browser. Then use IE to check for it’s quirks.
Thread Starter
LL
(@ll)
I’ve switched out for a jpg, I use Firefox for everything, and I’ve cleared my cache repeatedly, basically after each and every change.
I am at a total loss as to what to do.
My file is at http://chromedcurses.com/wp-content/themes/darkcontrast/images/header.jpg
I am assuming that is exactly where it’s supposed to be.
Any other advice?
This works for me (deleted reference to image in #header, full path to image with no quotes (not needed for local path) in #headerimg:
#header {
}
div#headerimg { display:block;
background:url(/wp-content/themes/darkcontrast/images/header.jpg);
margin: 7px auto;
height: 199px;
width: 739px;
border:10px solid #8c0000;
}
I use the Web Developer Extension for Firefox. It’s very handy for tracking this stuff down.
If you’re still having problems, send me the ftp info from the Contact Me page at my website.
