Javascript broken paths issue

[eluser]fiktionvt[/eluser]
I have started a new CI project and I am have trouble with the paths to my images / javascript /css folders. My directory structure is like so

ci/public/images/..
ci/public/css/..
ci/public/js/..
ci/application/..

I have broken up the header, footer into two views so when I call my index() function when the page loads it looks something like this

$this->view->load('header');
$this->view->load('main');
$this->view->load('footer');

In my routes.php I point my site to load site.php controller in the application/controllers folder so when the page loads it calls my index function and everything works but the url of my page is shown as www.example.com,

When I navigate away by clicking a link to a different page located at www.example.com/ci/sites/contact
all of my links to my javascript / css / images in my header view are not found because the path is looking off of what is in my url which is www.example.com and not www.example.com/ci/site/contact, how can I make it always point to the same location?