Login

08-18-2011, 02:21 AM

[eluser]Mavrick[/eluser]
I have an external CSS and I had the worse issues in it than putting my css in the header... When you call your external CSS ... It wont set any single style on the page Sad

... It gets even worse... So for alternative I asked few people and they asked me to put css in the header file. And it was a bit logical in the sense that header view is called on all the pages so you dont have to link css.. Linking CSS wont get any single image...

Can you provide me a solution for that??? Cause its the right way and I have been looking for the best practices...

08-18-2011, 02:58 AM

[eluser]jblack199[/eluser]
when you load your external css you do it the same as you just did for the image.... take mine for example..

in my view file:

Code:
&lt;link href="&lt;?php echo base_url();?&gt;inc/css/adm/ui.base.css" rel="stylesheet" /&gt;

&lt;link href="&lt;?php echo base_url();?&gt;inc/css/adm/ui.login.css" rel="stylesheet" /&gt;

now as you can tell from that, ive got in my document_root a folder named inc.. inside that file i have 3 more folders... js, css and images...

my ui.base.css just has a bunch of @import commands in it... so in the first one it calls ui.core.css

Code:
body {background:#262626;}

a {text-decoration: none;}

#page_wrapper {

    position: relative;

    height: 100%;

    width: 100%;

}

#page-header {

    background: url('../../images/adm/header-bg.png') repeat-x;

    height: 111px;

}

now remember how i said the image paths in CSS are relative to the path of the css file itself? thats why i have the ../../images in my last declaration there... by doing it it takes from base_url()inc/css/adm/ back to base_url()inc/images so my image loads fine...

08-18-2011, 04:24 AM

[eluser]Mavrick[/eluser]
Thank JBlack It worked. Smile

... What I did in my CSS file was :

Code:
body {

 background-image: url('../images/nature.jpg');

}

And in my header.php view I added the line instead of the CSS :

Code:
&lt;head&gt;

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

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

    &lt;link rel="stylesheet" href="&lt;?php echo base_url();?&gt;assets/css/style.css" /&gt;

&lt;/head&gt;

It was working this way. added the helper in controller ... But there was one more thing left I guess.. i.e. On top of my CSS file I had css for body tag. However when I started browser element inspector It didn't displayed my body css in it. Some how browser omitted the first css for some reason I don't know. So I created an empty pseudo class on top of my body css tag.. And It started loading my css properly.

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

.mold{}

body {

 background-image: url('../images/nature.jpg');

}

.container {

    background-color: #000;

    width : 100%;

}

a {

 color: #003399;

 background-color: transparent;

 font-weight: normal;

}

h1 {

 color: #888;

 background-color: transparent;

}

&lt;/style&gt;

Though its silly Confused

hut: ... But on the bright side :lol: It worked!!!

08-18-2011, 06:43 PM

[eluser]jblack199[/eluser]
If you actually have the <style and </style things in your .css file, remove them as you dont need them...

just start line 1 with body { } and try to forget that background-color and background-image even exist... 98% of people just use background: and it seems to work great (i think the others are deprecated or something like that)...

but glad it works Big Grin