Client Side Things
 
Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support | 
User Name:
Password:
Remember me
Go Back   Codewalkers Forums > Other Technologies > Client Side Things
Reload this Page

CSS Background

Discuss CSS Background in the Client Side Things forum on Codewalkers.
CSS Background Here is a place to talk and ask questions about HTML, CSS, Javascript, and other client side technologies.

Reply
Add This Thread To:
  Del.icio.us   Digg   Google   Spurl   Blink   Furl   Simpy   Y! MyWeb 
« Previous Thread | Next Thread »  
Thread Tools Search this Thread Rate Thread Display Modes
 
Unread Codewalkers Forums Sponsor:
  #1  
Old October 27th, 2005, 04:54 PM
The Squirrel The Squirrel is offline
Codewalkers Newbie (0 - 499 posts)
  
Join Date: Apr 2007
Location: Mid-Indiana, USA
Posts: 153 The Squirrel User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 2
Send a message via ICQ to The Squirrel
CSS Background
Greetings everyone!

I am having some problems with a CSS file.
I have my template.htm where I call an external CSS file
Code:
<link rel="stylesheet" type="text/css" href="CSS/style.css" />
That code is placed in my <head> information.

I am just starting a new webpage and all that the style.css file consists of is
Code:
<style type="text/css">
<!--
body {
	background-image: url("Graphics/Layout/BG.png");
}
-->
</style>


For some reason though it will not set the background image that I am calling. I am missing some simple I'm sure but I cannot figure it out.

I have tried getting it to work by putting the BG.png file and the style.css file into the same directory as template.htm, but that did not solve anything.

My root folder holds my tamplate.htm file and then the folders 'CSS' and 'Graphics'. 'CSS' holds the style.css file and then 'Graphics' has another folder inside it 'Layout' which contains the BG.png image.

Any help would be most appreciated. Thanks!

Edit: Forgot to add that if I use the CSS code inside my template.htm file, it works great. I just cannot get it to work from an external CSS file.
Reply With Quote
  #2  
Old October 27th, 2005, 05:05 PM
Ashkhan Ashkhan is offline
Contributing User
Codewalkers Newbie (0 - 499 posts)
  
Join Date: Apr 2007
Posts: 372 Ashkhan User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 1 h 24 m 57 sec
Reputation Power: 2
RE: CSS Background
The stylesheet contains only informations about formating. No html tags.

In your case only these 3 lines.
Code:
body {
background-image: url("Graphics/Layout/BG.png");
}
Reply With Quote
  #3  
Old October 27th, 2005, 05:35 PM
The Squirrel The Squirrel is offline
Codewalkers Newbie (0 - 499 posts)
  
Join Date: Apr 2007
Location: Mid-Indiana, USA
Posts: 153 The Squirrel User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 2
Send a message via ICQ to The Squirrel
RE: RE: CSS Background
Ok, I removed the HTML tags, but it still doesn't work. Or did I misunderstand what you said?

I doubt this has anything to do with it, but I just noticed that there is an "-" displaying on the page when I preview it to see if the background works. It is there even though there is nothing between the <body> tags. I will keep messing with this here trying to figure it out.

Edit: NVM. I figured that part out. The "-" was hiding right after my <html xmlns="http://www.w3.org/1999/xhtml"> code at the top of the page.

Thanks for the response.
Reply With Quote
  #4  
Old October 27th, 2005, 06:01 PM
tkarkkainen's Avatar
tkarkkainen tkarkkainen is offline
Moderator
Click here for more information
 
Join Date: Apr 2007
Location: Finland
Posts: 2,326 tkarkkainen User rank is Lance Corporal (50 - 100 Reputation Level)tkarkkainen User rank is Lance Corporal (50 - 100 Reputation Level)tkarkkainen User rank is Lance Corporal (50 - 100 Reputation Level)  Folding Points: 16550 Folding Title: Novice Folder
Time spent in forums: 6 Days 9 h 39 m 34 sec
Reputation Power: 4
RE: CSS Background
A quick hint: It's a good idea to use only lower case letters in directory and file names. This reduces frustration with remembering where the capital letters are.

Which makes me ask this question: Are you sure your css file is styles.css and not Styles.css for example? Or that it is in Graphics/Layout and not Graphics/layout for instance?

You said you removed the HTML tags, did you also remove the HTML comments? Can you post both your HTML and CSS file here?
Reply With Quote
  #5  
Old October 27th, 2005, 06:10 PM
The Squirrel The Squirrel is offline
Codewalkers Newbie (0 - 499 posts)
  
Join Date: Apr 2007
Location: Mid-Indiana, USA
Posts: 153 The Squirrel User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 2
Send a message via ICQ to The Squirrel
RE: RE: CSS Background
I doubled checked all possibilities for capitalization issues. Everything checked out. I went ahead and made everything lower case to prevent issues in the future.

Here are the contents of both files:
template.htm
Code:
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>TITLE REMOVED</title>
<META http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<META name="author" content="NAME REMOVED" />
<META name="geo.position" content="40.76;-86.36">
<META name="geo.region" content="US-IN">
<META name="geo.placename" content="Logansport">
<META name="dc.title" content="NAME/TITLE REMOVED" />
<META name="dc.language" content="en" />
<META name="copyright" content="© 2000-2005 NAME REMOVED" />
<link rel="shortcut icon" href="graphics/favicon/favicon.ico" />
<link rel="stylesheet" type="text/css" href="CSS/style.css" />
</head>

<body>

</body>

</html>


style.css
Code:
body {
	background: url("graphics/layout/BG.png");
}



The interesting thing is I've never had problems linking to an external CSS file before. I have compared previous sites I've done and everything related to CSS is done exactly the same.
Reply With Quote
  #6  
Old October 27th, 2005, 06:40 PM
tkarkkainen's Avatar
tkarkkainen tkarkkainen is offline
Moderator
Click here for more information
 
Join Date: Apr 2007
Location: Finland
Posts: 2,326 tkarkkainen User rank is Lance Corporal (50 - 100 Reputation Level)tkarkkainen User rank is Lance Corporal (50 - 100 Reputation Level)tkarkkainen User rank is Lance Corporal (50 - 100 Reputation Level)  Folding Points: 16550 Folding Title: Novice Folder
Time spent in forums: 6 Days 9 h 39 m 34 sec
Reputation Power: 4
RE: CSS Background
Okay, I think I know what the problem is.

Your directory structure is something like this
- (main directory)
- * template.html
- * CSS/
- * - style.css
- * graphics/
- * - layout/
- * - * bg.png

If you put your css in the html file, it will get the bg from (main)/graphics/layout/BG.png, but when you put it in the CSS file, the browser will try to get it from (main)/CSS/graphics/layout/BG.png. So try changing the url to ../graphics/layout/BG.png or /graphics/layout/BG.png
Reply With Quote
  #7  
Old October 27th, 2005, 06:50 PM
The Squirrel The Squirrel is offline
Codewalkers Newbie (0 - 499 posts)
  
Join Date: Apr 2007
Location: Mid-Indiana, USA
Posts: 153 The Squirrel User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 2
Send a message via ICQ to The Squirrel
RE: RE: CSS Background
Ok, I changed my CSS file to reflect the URL change
Code:
body {
	background: url("../graphics/layout/BG.png");
}

It worked. Thanks so very much!

I can't figure out why that would work and what I tried earlier wouldn't...I had a feeling that it had something to do with the file structure, so I took template.htm and style.css and put them into the same directory. I then edited both to reflect that. Then I moved BG.png into the same directory as those two and changed my CSS file to poing to just BG.png. None of that worked.

However, thinking about it more, I still had HTML tags in the css file at that point. That is probably what messed it up.

I knew it was something easy...

Thanks again!
Reply With Quote
Reply

Viewing: Codewalkers Forums > Other Technologies > Client Side Things > CSS Background

« Previous Thread | Next Thread »

Thread Tools  Search this Thread 
Search this Thread:

Advanced Search
Display Modes  Rate This Thread 
Linear Mode Linear Mode
Rate This Thread:


Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
View Your Warnings | New Posts | Latest News | Latest Threads | Shoutbox
Forum Jump


Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support | 
  
 





© 2003-2008 by Developer Shed. All rights reserved. DS Cluster 5 hosted by Hostway.