PDA

View Full Version : CSS Header Help



RockerMan
Jan 3rd, 2011, 05:15 PM
Hey guys,

I'm having a little trouble with something. The header background image is not showing up and i can't think why not. When I go to view the "Page Info" in firefox and select the media tag the only image coming up is the logo image :/ Any help would be appreciated :)

This is the HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<meta name="keywords" content="keyword, keyword two, keyword three" />
<meta name="description" content="This is the description of the page." />
<meta name="distribution" content="Global" />
<meta name="rating" content="General" />
<title>Graphics Spot - Homepage</title>
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen" title="no title" charset="utf-8">
</head>

<body>
<div id="header">
<img src="img/logo.png" alt="logo" class="logo"/>
</div>

<did id="content">
</div>

<div id="footer">
</div>
</body>

and this is the CSS:

* { padding: 0; margin: 0;}

#header{ background-image: url(img/head_top.jpg) repeat-x; top: 0px; position: fixed !important; width: 100%; height: 120px; }

#contet { }

#footer { }

abduraooft
Jan 3rd, 2011, 05:30 PM
background-image: is used to specify the "image url". To declare everything in a single line, the shorthand property is background:

RockerMan
Jan 3rd, 2011, 05:33 PM
Still not working...

phpdeveloper
Jan 3rd, 2011, 05:53 PM
If possible then please give us site url.
So we can look at online and give you better help for the same.

RockerMan
Jan 3rd, 2011, 06:08 PM
Sure, here you go :)

http://graphics-post.com/home/website/

Excavator
Jan 3rd, 2011, 06:15 PM
Hello RockerMan,
That code would work if the image was in that directory. Nothing at this url though - http://graphics-post.com/home/website/img/head_top.jpg

Check both the path to the image and the spelling.

A typo further down in your code is going to give you trouble...

RockerMan
Jan 3rd, 2011, 06:26 PM
Nope, All of that is correct, here's a screenshot from FireBug just so you know im not bluffing.

I've checked it over 1000 times and can't seem to find out whats wrong with it...

http://img837.imageshack.us/img837/6552/proofjf.jpg

I've validated both the HTML and the CSS and both are valid.

Excavator
Jan 3rd, 2011, 06:36 PM
http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fgraphics-post.com%2Fhome%2Fwebsite%2F

Click on these links -
http://graphics-post.com/home/website/img/head_top.jpg
http://graphics-post.com/home/website/img/logo.png

RockerMan
Jan 3rd, 2011, 06:49 PM
OK, fixed.

Everything is now valid....

http://validator.w3.org/check?uri=http%3A%2F%2Fgraphics-post.com%2Fhome%2Fwebsite%2F&charset=%28detect+automatically%29&doctype=Inline&group=0

Images have been re-uploaded to the folder, still not working...

It's not even working when I'm putting a direct link in from ImageShack :confused:

Premisions are also fine...
http://img513.imageshack.us/img513/6181/moreproof.jpg

Excavator
Jan 3rd, 2011, 06:57 PM
This is working for me on this end now -
#header{ background: url(../img/head_top.jpg) repeat-x; top: 0px; position: fixed !important; width: 100%; height: 120px; }


Odd how this works now and didn't before...
http://graphics-post.com/home/website/img/head_top.jpg

Oops, check that... still gets a 403. Very odd.

RockerMan
Jan 3rd, 2011, 07:57 PM
Thanks alot pal, would have drove me insane by the end of the day :)

Rob

LearningCoder
Jan 5th, 2011, 12:08 AM
While were on the topic of images, do you guys create your on logos etc or have someone do them?

What would be the best program to design a logo?

RockerMan
Jan 5th, 2011, 12:18 PM
While were on the topic of images, do you guys create your on logos etc or have someone do them?

What would be the best program to design a logo?

Yes I create my own, Photoshop is the industry standard at them moment :thumbsup:

LearningCoder
Jan 5th, 2011, 12:22 PM
Ah right. It's quite tricky to get the hang of at first...would I be right in saying that?

Just wondering whether it would be worth my while to go and get a copy.
Obviously it is a lot more complex than say Paint, right? :p

sarenarichard
Jan 5th, 2011, 01:10 PM
This is obviously a tricky thing, do keep in mind :)

LearningCoder
Jan 5th, 2011, 01:38 PM
Yea to be fair I wouldn't have a clue where to start, I think I had a copy years ago and I do remember it to be complicated so i'll pass. :)

What other route can I pursue?

RockerMan
Jan 5th, 2011, 06:21 PM
Ah right. It's quite tricky to get the hang of at first...would I be right in saying that?

Just wondering whether it would be worth my while to go and get a copy.
Obviously it is a lot more complex than say Paint, right? :p

It can be, just buy a few books. Read them, you sharp get the hang of it :)

LearningCoder
Jan 5th, 2011, 06:30 PM
It can be, just buy a few books. Read them, you sharp get the hang of it :)

Lol, I need to learn this bloody HTML, CSS, and JS first before I start venturing in other areas!

I'd rather pay a small fee and have what I want within a couple days if anyone is interested.

I've got a few ideas for some logo's etc drawn out, but it's creating it on here which is out of my limits.

Anyone interested, just PM me and we'll sort some details out!:thumbsup: