Hamid Mohayeji
Hamid Mohayeji

Reputation: 4275

CSS Not Working With CodeIgniter

Here is a part of my CI code:

    class page extends CI_Controller {

        var $Page;

        public function __construct() {
            parent::__construct();
            $this->Page = 1;
            $this->load->model('posts_model');
            $this->load->helper('url');
        }


        public function index() {
            $data['posts'] = $this->posts_model->get_posts($this->Page);
            $this->load->view('header');
            $this->load->view('main', $data);
            $this->load->view('footer');
        }

        function page_num($page) {
            $this->Page = $page;
            $data['posts'] = $this->posts_model->get_posts($this->Page);
            echo $this->Page;
            $this->load->view('header');
            $this->load->view('main', $data);
            $this->load->view('footer');
        }

    }

And this is link tag of my View File:

<link rel="stylesheet" type="text/css" href="css/indexpage.css" media="all"/>

When I open the index file (/My-Site/), CSS works fine, but when I open for

example the url :

" /My-Site/page/page_num/3 ",

the page opens but with no CSS styles!

Can any body help me please?

Upvotes: 4

Views: 21933

Answers (7)

user1741851
user1741851

Reputation:

It is usually a good practice to use

<base href="<?php echo base_url(); ?>" />

in your head section of the view page. That way you don't have to worry about adding base_url to all your href and src attributes. So if your css file is in codeigniter/assets/css folder, just use

<link type="text/css" rel="stylesheet" href="assets/css/style.css" />

Similarly for subsequent scripts and css you can just use "assets/js/filename" or "assets/css/filename".

Upvotes: 2

broswilli
broswilli

Reputation: 317

When working with codeigniter remember that the only page that outputs HTML is the index.php file so your css should be relative to this file or you use absolute url. You can create a folder anywhere some developers create an asset folder at the webroot here they place their javascript folder image folder and css folder. But the safest way to go is to use absolute links for your assets-Javascript, css, and images. The easiest way to use absolute link is to use base_url("assets/css/indexpage.css"); This is how to use it:

  1. Load url helper in any of your controllers. $this->load->helper('url);
  2. In your view the area where you want to do the linking use the base url function.

Upvotes: 0

max
max

Reputation: 3716

1 - change it to :

<link rel="stylesheet" type="text/css" href="<?php echo base_url('css/indexpage.css');?>" media="all"/>

and you sould already know this , in

application/config/config.php

set

$config['base_url'] = 'www.yorsite.com';

2 -

you have to include the css only in one of your views

i.e

if you have include it in the header.php file do not add it to the main.php or footer.php

Upvotes: 3

Vipin Jain
Vipin Jain

Reputation: 1402

use base_url() function to get the url of the site

base_url() gives the url of the website where the index file is located.

eg: /My-Site/

or you can give the file location as the parameter: base_url('/css/indexpage.css') then use it as <link rel="stylesheet" type="text/css" href="<?php echo base_url('/css/indexpage.css');?>" media="all"/>

Upvotes: 11

Abid Hussain
Abid Hussain

Reputation: 7762

Try it.

you can use base_url() in your css. see below code.

<link rel="stylesheet" href="<?php echo base_url(); ?>css/style.css" type="text/css" media="all" />

Upvotes: 4

Rysiu
Rysiu

Reputation: 104

Change URL here:

<link rel="stylesheet" type="text/css" href="css/indexpage.css" media="all"/>

to:

<link rel="stylesheet" type="text/css" href="/css/indexpage.css" media="all"/>

Slash at the beginning will point to domain without any sub categories.

Upvotes: 0

user1653850
user1653850

Reputation: 29

It depends on where you have placed the css file. Try ../css/indexpage.css

Upvotes: -2

Related Questions