PHP page not linking with updated css file - php

My CSS is linked in my head tag underneath the title tag like this:
<link href="css/main.css" rel="stylesheet">
I was working with the styles yesterday and it was applying the styles well.
Today i am adding new styles and they are not working with the PHP file, it still has the css from yesterday when i check the page source even though i have changed the css file.
What has happened?

Hard reload is the correct fix here (CTRL+R in Chrome, similar in other browsers).
You can also fix the issue forever by appending your link to the css file with a query variable that changes, say, every day so that browsers will only cache the css file for a day.
<link href="css/main.css?date=<?php echo date('Y-m-d'); ?>"> rel="stylesheet">

Related

CSS styles not being applied in XAMPP localhost

I use XAMPP to create PHP pages and test them locally, but have an issue with the CSS styles not being applied.
When I browse to http://localhost/example/index.php I get the correct PHP page output, but it is unstyled.
When I browse to file:///c:/xampp/htdocs/example/index.php I get the page and it is styled so I know that my CSS links are not the problem.
Does anybody know what's happening and how to fix it?
since you didnt provide any code, I suspect you are using absolute path instead you should use relative path
suppose below is your structure
index.php
css
-- main.css
then you should link you css like
<link type="text/css" href="css/main.css" rel="stylesheet" />
hope it helps

How to add or update css file in PHPFOX

I am trying to update existing css file but file is not updating, seems phpfox is generating cache. Then I tried to add another css file in template.html.php using following code..
<link rel="stylesheet" type="text/css" href="{param var='core.path'}theme/frontend/freedawn/style/default/css/cus_style.css" />
Html file gets updated but displays error "CSS file not found."
How to add/ update css/js file in PHPFox?
set version number at the end of file for getting a current version.
<link rel="stylesheet" type="text/css" href="style.css?1"/>
Have you tried to clear the cache in Maintenance / Cache Manager? If you modified controller and assets, such as CSS, most probably site will display old cached data and you won't be able to locate your changes.

WAMP + PHP CSS Include wont update with new styles

I am stumped. I am using includes to import a style sheet. If I add a new style to the style sheet, generated pages will not display ANY of the new css. If I change an old css rule it WILL display the change. I thought it might be a cached file of some kind, but I have cleared the cache in all testing browsers and the problem persists.
At first I thought it was a WAMP issue, but the problem happens when I move it all live as well so now I am thinking I am doing something wrong with the includes....
<link rel="stylesheet" type="text/css" href="css/foundation.css">
<!-- Included Custom Overides -->
<link rel="stylesheet" type="text/css" href="css/Custon_Foundation_Overides.css">
<!-- Supersizer CSS -->
And this is simply my include...
<?php require("Includes/HEADER.php"); ?>
Again, all the old CSS works fine, just any new additions to any of the style sheets will not display.
Thanks
<link rel="stylesheet" type="text/css" href="css/Custon_Foundation_Overides.css">
Maybe "Custon_Foundation_Overides.css" is a typo and you meant "Custom_Foundation_Overrides.css" or maybe you have to upload the file with correct letters capitalization.
Sounds like a browser cache issue. A simple way to fix this while maintaining good caching practices would be to pass the file make time as a query var to the file.
<link rel="stylesheet" type="text/css" href="css/foundation.css?ver=<?php echo filemtime('css/foundation.css');?>">
This will generate a string like:
<link rel="stylesheet" type="text/css" href="css/foundation.css?ver=1382564850">
This way when you update the file your browser will think its a new file and cache that, but as long as the file remains unchanged it will have the same name and maintain the browser cache.

Stylesheet not loading. URL duplicating on click

I have a big prob. We have a site that was working just fine but I was doing some fine tuning and somewhere along the line i messed things up. possibly in the .htaccess file.
My problem is that my css style sheet doesn't load nor do my images. ahh! They are all there.
I emptied my .htaccess file and deleted my robots.txt just to eliminate any blocking but that didn't fix it.
I validated my css file with The W3C CSS Validation Service and it said:
file not found: http://easybuildingproducts.ca/www.easybuildingproducts.ca/style.css
I feel like it has something to do with the fact that the URL is duplicated. It does that now when i click a link to any of my pages. It should be either or not both those links together. Is it possible a google cached my .htaccess or robots.txt when there was a potential redirect error? Is there a loop happening somewhere?
I was in the midst of making a custom 404 error page when this all went down.
www.easybuildingproducts.ca
Easy fix
<link href="www.easybuildingproducts.castyles/inside.css" rel="stylesheet" type="text/css">
That needs to be either one of the following
<link href="/styles/inside.css" rel="stylesheet" type="text/css">
or
<link href="http://www.easybuildingproducts.ca/styles/inside.css" rel="stylesheet" type="text/css">
I looked at the actual website source to find this example. there are quite a lot like it
Change the href to "/style.css" instead of writing your full domain out. Do the same kind of thing for all other resources that failed to load, too.
This will fix your problem, and it will also make your markup compatible if you decide to migrate to a different dsomain name in the future.
Your resources aren't being loaded (css, js, jquery, etc). Take a look at the screenshot taken from my Chrome Dev Tools > Sources tab:
This is because of your resources' file paths. It is definitely not a good idea to reference all of your resources with "www." in the file path.
Change
<link href="www.easybuildingproducts.castyle.css" rel="stylesheet" type="text/css" />
into
<link href="/castyle.css" rel="stylesheet" type="text/css" />

Load CSS file from a header used in many pages

I used to create a unique header and load it in all my pages like this.
<?php
require_once('include/_header.php');
?>
<div id="main">
<!-- My Page -->
</div>
<?
require_once('include/_footer.php');
?>
In my root folder I have a folder named css where I put all my css stylesheets
in the header I call <link rel="stylesheet" href="css/style.css" type="text/css">.
Now, suppose I have to create a subfolder inside my root and I create a web page into it. When I call my stylesheets from the header, the page doesn't show correctly, because I call the stylesheet in a wrong way. How can I call my stylesheet in a way so that it can always be reachable from any position?
Here is the schema:
css
-style.css
include
-_header.php
-_footer.php
folder
-mypage.php
Use an absolute path:
<link rel="stylesheet" href="/css/style.css" type="text/css">
(Note the slash before the css directory)
Let me offer a way to debug this particular issue and other CSS reference issues in the future. Open up your page and then activate your browser's developer tools. (CTRL+SHIFT+I in Chrome).
Go to the Elements tab. Navigate the DOM until you see the CSS Entry. The URL for the stylesheet will be a clickable hyperlink. Click it. See where the browser navigates you. this should give you an indication as to what the fix is. Maybe you are too deep in the folder structure, maybe you are too shallow. In any case, I solve 99% of my CSS reference issues this way.
You should a base URL in your HTML header
<base href="http://website.com/"/>
Then everything regardless will become as follows..
<link href="css/style.css" rel="stylesheet" type="text/css">
Down the track for your menus you and simply go
Contact
Change your stylesheet href to href="/css/style.css"

Categories