Welcome Guest, Not a member yet? Register   Sign In
Background Image in CSS problem.
#1

[eluser]BenSeagrave[/eluser]
I have made a 50x50 pixel image in photoshop. It's just a white image with added noise. I have made a 'img' folder in the applications folder of CI and have saved the image inside the img file. In my css I have this:

Code:
body {
    background: #FFFFFF url(../img/bgNoise2.jpg) repeat;
}

This should be showing my image repeated across the background should it not? I've tried using a different image but it doesn't work. I've been following a tutorial on nettuts and he has the same folder layout as me like the template.php loading the header, main content and footer and that.

This is the tutorial: http://net.tutsplus.com/tutorials/html-c...chapter-5/

I don't understand why this is not working, can anyone tell me?

btw my css and img folder are both inside the applications folder.
#2

[eluser]John_Betong_002[/eluser]
The file path for the image is relative to your index.php file.

A better way to do this is to have an assets folder in your root directory:
Code:
body {
    background: #FFFFFF url(  assets/img/bgNoise2.jpg ) repeat;
    background: #FFFFFF url( /assets/img/bgNoise2.jpg ) repeat;
    background: #FFFFFF url(./assets/img/bgNoise2.jpg ) repeat;
}
 
at least one of these should work Smile
 
#3

[eluser]InsiteFX[/eluser]
The application folder is protected by a .htaccess file denying all!

Do like John_Betong_002 mentioned and create a assets folder in the root.

InsiteFX
#4

[eluser]Stoney[/eluser]
Use firebug to inspect page elements.
You placed the files (css, and images) in wrong folders.

Use root folders, like:
-css
-images

or:
-assets/images
-assets/css
#5

[eluser]Aken[/eluser]
[quote author="John_Betong_002" date="1311408825"]The file path for the image is relative to your index.php file.[/quote]
Incorrect. The file path for the image is relative to the CSS file.
#6

[eluser]toopay[/eluser]
Should be...
Code:
body {
    background: #FFFFFF url(/application/img/bgNoise2.jpg) repeat;
}

Better way to do that, is to create a single controller (named static or whatsoever), as "assets provider", then you could mannualy setting cache and other usefull stuff also have uniformal path, something like...
Code:
body {
    background: #FFFFFF url(/static/img/bgNoise2.jpg) repeat;
}
#7

[eluser]NeoArc[/eluser]
But remember not to use absolute paths ( beggining with: /) if your CI instalation is in a subdirectory.
Relative paths to the CSS file are good:


assets/css/hello.css
assets/img/pattern.jpg

Code:
/* hello.css */

body{ background-image: url(../img/pattern.jpg); }



And.. perhaps you should link to your css file (and other internal files) like this (requires URL helper):


Code:
<head>
<title>-</title>
<base href="<?php echo base_url()?>" />
<link rel="stylesheet" href="assets/css/hello.css" />
</head>
<body>
<div>
  <img src="assets/img/sun.png" alt="Tha Sun" title="" />
</div>
&lt;/body&gt;




Theme © iAndrew 2016 - Forum software by © MyBB