CSS is missing when rendering an html page with codeigniter - css

I'm aware this is similar to numerous existing posts but after looking at a number of others I wasn't able to solve my problem. I'm attempting to load a folder full of html files I've been supplied with. I didn't write them but I have been modifying them to integrate them into an existing system.
I've tried three ways of opening them, with varying success:
1) Simply right click on 'index.html' and go 'open with' and select a browser. This works perfectly!
2) Place the whole folder contents, unchanged, onto my server under 'public_html/cat/html' and navigating to the url 'localhost/cat/html/index.html'. This returns a '404 page not found error'.
3) The strange one. Place the html files in the 'application/view' folder, separate the included css and javascript files and place them in existing folders 'public_html/css' and 'public_html/js' and update the links to them in the html files appropriately. These now look something like:
<link type="text/css" href="css/cat/style.css" rel="stylesheet" />
If I load this page by running a function that uses CodeIgniter's $this->load->view(...) function it finds the index file but loads it with no css and with broken links to the other pages. I've explored the page source and seen that the link is exactly as above but clicking gives an error that reads "404 Not Found...The requested URL /css/cat/style.css was not found on this server".
I've attempted to use the base_url() function (and site_url()) like this:
<link type="text/css" href="<? base_url('css/cat/style.css') ?>" rel="stylesheet" />
and it yields the same result on the surface but examining the page source reveals the link line has become:
<link type="text/css" href="" rel="stylesheet" />
which seems to be even worse!
Any hints?
Thanks for reading

Try the following:
<link type="text/css" href="<?php echo base_url('css/cat/style.css') ?>" rel="stylesheet" />
base_url() functon simply return value, you should take a care for displaying returned value to output! :-)

Have you correctly configure you config file in codeIgniter ?

Or shorthand
<link type="text/css" href="<?=base_url('css/cat/style.css') ?>" rel="stylesheet" />
Then view your page source and copy the link from there to your browser, see if you can access it.

Can try this code <link type="text/css" href="<?=base_url('css/cat/style.css');?>" rel="stylesheet" />
if it doesn't work, you could try <link type="text/css" href="<?=base_url('css/cat');?>/style.css" rel="stylesheet" />

Related

Style suddenly does not show after no changes made to it, no error in the console or cmd

I am working with node.js, express and .ejs files. My style did work and i did not change anything about it before it stopped.
Here is the code:
https://github.com/RTweety/todoapp-v1/tree/main/todoapp-v1
I've checked the path and changed both it in the script.js and list.ejs but no response.
I also tried to restore the code to the point when it did work but it did not work.
I've cloned Your Project and You have bug in header.ejs file.
Instead of this line
<link type="text/css" href="css/styles.css" />
You should use <link/> tag like that and that's it ! :-)
<link rel="stylesheet" href="css/styles.css" />
Here You have reference about How To link an external stylesheet
Folder and file structure script.js, header.ejs, terminal:
Output in browser:

load css in CodeIgniter?

Currently I am using CodeIgniter_2.1.3 and my problem is my css file is not work, but i think it load well because when I view the source code and click the following href link it help me to view the css file.
<link rel="stylesheet" type="text/css"
href="http://localhost/CodeIgniter/_css/style.css"
media="screan" charset="UTF-8" title="no title" />
I keep my css file in CodeIgniter/_css directory and I use the following code ::
<link rel="stylesheet" type="text/css"
href="<?php echo base_url('_css/style.css');?>"
media="screan" charset="UTF-8" title="no title" />
I also use the following but no effect.
<link rel="stylesheet" type="text/css"
href="<?php echo base_url();?>_css/style.css"
media="screan" charset="UTF-8" title="no title" />
Make sure you have loaded URL helper :
$this->load->helper('url');
Inspect using firebug or other web development tools for browsers if valid link has been printed on your link href.
If everything seems fine, then refresh the page. Ctrl + F5 which fetches the file from server again.
URL Helper: Codeigniter Guide
Is that localhost address what you're using? That's only going to work if you're running the browser on your server . . . spelling screen correctly would help as well.

CSS Reference Issue

I was hoping someone may be able to help out with an issue.
I have a site that is accessed through a root domain (originalDomain.com) and the CSS is linked as below.
<link href="../../Styles/Css/style.css" rel="stylesheet" type="text/css" />
This all works fine
However I can also access this site on a different domain. Rather than the absolute root of the domain this one is accessed at newDomain.com/login. This still points to the files at the location of the original domain but because of the /login is unable to locate the CSS file. I assume the ../../ takes it to newdomain.com rather than newdomain.com/login.
Is there an easy way to have a single CSS reference without any back end code changes that will allow the CSS to be successfully referenced at both of the above scenarios.
I hope this makes sense.
Any help is greatly appreicated.
Give absolute paths and not relative ones
<link href="/path/to/css/style.css" rel="stylesheet" type="text/css" />
Note the first character is a / (slash)
If your <head></head> tag contains runat="server" you can simply specify it as:
<link rel="stylesheet" type="text/css" href="~/CSS/Style.css" media="screen" />
Taken from here

ASP.NET CSS file in master page

In my application I have next problem. I created master page and some content pages, some of which are located in the nested folders. In the master page I added the link to .css file
<link href="default.css" rel="stylesheet" type="text/css" />
But pages are located in the nested folders can't use this .css file. How can I fix this? I want to have one .css file for all pages (:
Thanks!
<link href="~/default.css" rel="stylesheet" type="text/css" />
This problem can be resolved by adding next code in master page
<style type="text/css" runat="server">
#import '<%= ResolveUrl("~/default.css")%>';
</style>
But designer of VS can't process this and you couldn't view your styles in it.
The css shouldnt be relative to the master page but rather it should be relative to the location of the Page instance using the master page. In most cases this will be the same thing but I would always try to use either a fully qualified path or a site relative path
Fully qualified path
<link href="http://some.site.com/mysite/styles/default.css" rel="stylesheet" type="text/css" />
or a relative path (note this might not work if you have a version which can only host one site but many apps such as WinXP)
<link href="/default.css" rel="stylesheet" type="text/css" />
Win xp relative path
<link href="/path/to/application/default.css" rel="stylesheet" type="text/css" />
If you using website under website, change in subfolder masterpage CSS link
<link href="Styles/Site.css" rel="stylesheet" type="text/css" />
change with below
<link href="../Styles/Site.css" rel="stylesheet" type="text/css" />
The way you defined you style sheet means: the style sheet is in the same folder as the page which uses it.
If you want to have one style sheet for all pages you should put in in one place (I prefer /assets/css folder in the application root) and define the path using this folder:
<link href="/assets/css/default.css" rel="stylesheet" type="text/css" />
The other way to archieve this is to use Themes, in this case styles will be added automatically.

ASP.NET Root folder of website in CSS

So, I thought I'd try my luck on ASP.NET. I didn't get very far before I found my first problem.
I have a folder layout like so:
\
->Admin
-->Admin.Aspx
->CSS
-->Style.css
->Images
-->bg.gif
Default.aspx
Default.master
Both admin.aspx and default.aspx use the default.master page, which contains the line:
<link rel="stylesheet" type="text/css" href="CSS/Style.css" media="screen" />
This works for the default.aspx page, because the path is valid, but for the admin page it's not.
Is there any special character, like ~ for home in Linux, to indicate the root path?
I can't use just a slash, because the website maybe under a sub folder when hosted.
Hopefully I've explained myself so you can understand what I need to do :)
I guess it's more an HTML issue than an ASP issue.
If your <head></head> tag contains runat="server" (which IIRC it does by default) you can simply specify it as:
<link rel="stylesheet" type="text/css" href="~/CSS/Style.css" media="screen" />

Resources