Login

08-17-2011, 01:09 PM

[eluser]Mavrick[/eluser]
Hey every one,

I have a header view which looks something like this:

Code:
<!DOCTYPE html>

&lt;html lang="en"&gt;

&lt;head&gt;

    &lt;meta charset="utf-8"&gt;

    &lt;title&gt;Mav!!!&lt;/title&gt;

    &lt;style type="text/css"&gt;

    body {

[i][b]     background-image: url('images/nature.jpg');[/b][/i]

    }

    &lt;/style&gt;

&lt;/head&gt;

I am having an issue with this background image. I have created a folder for images in root folder called images. Now, the thing is, when I load this view in my DEFAULT CONTROLLER. Image is displayed as a background. Let me provide you my call,

Code:
function __construct() {

            parent::__construct();

[i][b]            $this->load->view('header');[/b][/i]

        }

In the case mentioned above it displays the background image. Same line used to load the header view in other controllers but it doesn't display the background image, though it displays other styles...

Perhaps the issue can be the form that I have used in other views. But then it would be illogical

Can any one sort out something for CSS. I did googled the issue.. Many people have rewritten rules in .htaccess for CSS.But in my case I don't have any rule's except for Deny from all which I believe is used for the security purpose, which I guess does not have an effect on CSS...
So If any one can help. :roll:

Thanks in Advance,

08-17-2011, 01:33 PM

[eluser]jblack199[/eluser]
in your .htaccess have you granted access to your images folder? such as:

Code:
RewriteCond $1 !^(index\.php|images|robots\.txt)

If you havent, that is why it doesnt load any images..

08-17-2011, 01:39 PM

[eluser]Mavrick[/eluser]
Thanks JBlack for the reply :-) ... My .htaccess file is given below:

Code:
Deny from all

RewriteCond $1 !^(index\.php|images|robots\.txt)

But it doesn't work. Originally there was only first line... I removed the first line and did tried again.. But still it didn't worked. :down:

08-17-2011, 02:14 PM

[eluser]jblack199[/eluser]
RewriteEngine on
RewriteCond $1 !^(index\.php|images|robots\.txt)

08-17-2011, 02:23 PM

[eluser]Mavrick[/eluser]
Nope aint working :down:

08-17-2011, 02:27 PM

[eluser]jblack199[/eluser]
okay, lets try the image outside of the css... try to insert your image outside of css in your body, somewhere and see if that works...

another option is to not use background-image and use background

Code:
body {

 background: #000000 url('images/nature.jpg');

}

08-17-2011, 02:48 PM

[eluser]Mavrick[/eluser]
Still not working... :down:
I tried both ways...

Code:
<!DOCTYPE html>

&lt;html lang="en"&gt;

&lt;head&gt;

    &lt;meta charset="utf-8"&gt;

    &lt;title&gt;Mav!!!&lt;/title&gt;

    &lt;style type="text/css"&gt;

    body {

     background: #000000 url('images/nature.jpg');

    }

Tried above mentioned one and this as well : [I copied the image out on root to check if it works this way but no use]

Code:
<!DOCTYPE html>

&lt;html lang="en"&gt;

&lt;head&gt;

    &lt;meta charset="utf-8"&gt;

    &lt;title&gt;Mav!!!&lt;/title&gt;

    &lt;style type="text/css"&gt;

    body {

     background: #000000 url('nature.jpg');

    }

And tried this as well :

Code:
&lt;body style="background-image:url('images/nature.jpg');"&gt;

But it didn't worked... Then I tried :

Code:
&lt;body style="background: #000000 url('images/nature.jpg');"&gt;

That didnt worked as well :down:

Is there anything else that I am forgetting to do ????

08-17-2011, 03:10 PM

[eluser]jblack199[/eluser]
stop with the css. insert the image directly into the page using img src, this will give you a few clues as to what the css is doing.... so you would do an <img src="images/nature.jpg"> you can then load it, and view the properties of the image or red x that shows up, and see where the issue is, which will help you diagnose the css issue.

08-17-2011, 03:31 PM

[eluser]Mavrick[/eluser]
:lol: You said it before but I thought you said something else Big Grin

....
Yup ... Helped me out .. The issue was ...http://localhost:81/Mavrick/index.php/CONTROLLER/images/nature.jpg
It was adding the controller name in front it... SO I used url helper to resolve this issue...

Finally

Code:
background-image: url("&lt;?php $this->load->helper('url'); echo base_url().'images/nature.jpg' ?&gt;");

My base url was : http://localhost:81/Mavrick/
And so rest of the story is easy to understand!!!
:coolsmile:

Thanks JBlack for the help Smile

08-17-2011, 03:48 PM

[eluser]jblack199[/eluser]
autoload your url helper, and then you dont need to load it in your view file you just need to echo base_url() to get it... but glad it works Wink

tip about css:

images are relative to the css file path. so if you're not using an external css file, you're css file path would be the path of your URL.. its easier to use an external css file loaded in the head, then having the CSS directly in the html file itself -- its better for SEO and it lets you reuse the classes in the css file itself.