Mudsaf Posted February 3, 2012 Share Posted February 3, 2012 This is my Css file @charset "utf-8";* {margin-left:0px;margin-top:0px;}body {background-image:url(includes/images/background01.jpg);background-repeat:repeat;} #topic_background_one {background-image:url(includes/images/topic_background.jpg);width:1200px;} h1 {font-family:Chiller;font-size:20px;margin-left:2px;}h2 {font-family:Chiller;font-size:18px;margin-left:2px;}h3 {font-family:Chiller;font-size:16px;margin-left:2px;}h4 {font-family:Chiller;font-size:14px;margin-left:2px;}h5 {font-family:Chiller;font-size:12px;margin-left:2px;}p {font-size:10px;font-family:Chiller;margin-left:2px;} The problem is it doesn't show images like background or anything. Need some kind of fix and i didint find and errors. HTML page shows this below. It edits fonts but the images doesnt show. <html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><link href="includes/styles/style01.css" rel="stylesheet" type="text/css"><title>Untitled Document</title></head><body></body></html> Link to comment Share on other sites More sharing options...
ShadowMage Posted February 3, 2012 Share Posted February 3, 2012 Well, I don't see a #topic_background_one element anywhere in your HTML for starters. The other thing is to check your file paths. Paths are relative to the document in which the CSS file is included, not the CSS file. Link to comment Share on other sites More sharing options...
Mudsaf Posted February 3, 2012 Author Share Posted February 3, 2012 Actually didin't solve my problem :S Weird thing is that it works with <style> tag in html form, but it links too to correct css file also, but somehow doesn't modify the background. Link to comment Share on other sites More sharing options...
dsonesuk Posted February 3, 2012 Share Posted February 3, 2012 If your css file is inincludes/styles/style01.cssand you use includes/images/topic_background.jpg for the image it will assume you have folders includes/images/ from inside your css folder, whereas you should come out of css folder too the root of includes folder and enter the images folder by using '../images/topic_background.jpg'background-image:url(../images/topic_background.jpg); Link to comment Share on other sites More sharing options...
Mudsaf Posted February 3, 2012 Author Share Posted February 3, 2012 still doesn't work, copyed whole includes folder inside my styles folder, but this works. <style>body {background-image:url(includes/images/background01.jpg);background-repeat:repeat;}</style> Link to comment Share on other sites More sharing options...
ShadowMage Posted February 3, 2012 Share Posted February 3, 2012 If your directory looks like this: -index.html (This being the HTML file your working with)-includes -images -background01.jpg -topic_background.jpg -styles -style01.css In your HTML file you include the CSS file as:includes/styles/style01.cssInside the CSS file you need to reference your background images** as:../images/background01.jpg../images/topic_background.jpg You do not need to change your directory structure at all. Just change the file paths to correctly reference the image. ** After a quick test, it appears that I was wrong about how images are referenced in CSS files. Dsonesuk is correct, that files are referenced in relation to the CSS file rather than the HTML file as I had stated. Link to comment Share on other sites More sharing options...
Mudsaf Posted February 4, 2012 Author Share Posted February 4, 2012 Thx for all, fixed! Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.