I've seen this on a site:
<link rel="stylesheet" href="http://blablas.com/built/assets-styles.css?v=12355" />
which need to be underlined assets-styles.css?v=12355"
How to compile css file as above?
is it possible with less or sass?
[update]
And How about this?
<link rel="stylesheet" href="https://blablas.com/built/assets-201501-35b4b2bf0e75bb40f98d111b2d97951d.css">
CSS files are not to be compiled.
The reason the URI parameter is there could be it is not really a CSS file that's called, but a PHP engine (with mod_rewrite) that returns a CSS file based on the given parameter.
Another reason to use parameters is to force web browser to fetch the stylesheet again when necessary.
That has nothing todo with Compiling CSS! You use it for Cache Control. Everytime the CSS File gets changed they just need to change the numer and the new version gets requested.
In the 1st Link you posted ist a GET Variable therefore ist more likely to be vor some inernal Processing
Related
Today I started changing some CSS on a Symfony (2.6) project. I added some styling to my newly created css file and everything was working fine. My problem occured when I went to add another style and nothing happened. I checked the dev window and couldn't find my styles anywhere. I've deleted the cache multiple times. Im using Symfony with a vagrant box. If I open the css file in the url it is filled with diamond/question marks and my first style entry is still there. I checked and the encoding is set to UTF-8. Ive never had issues like this with css, does anyone know what the problem could be?
I am using Assetic to include the style sheet within the project like this:
`<link href="{{ asset('css/print_production_report.css') }}" rel="stylesheet" type="text/css" media="print" />`
So to show you whats happening I'll start from the beginning. I had this stylesheet (ignore the error):
And upon checking the browser I still have:
Now when I add some random text or css to my stylesheet as so:
You will see that all my changes are being converted into these diamonds:
I think this issue of caching files and replacing them with the unicode 'REPLACEMENT CHARACTER' (�) has to do with sendfile. Turn sendfile/EnableSendfile off in nginx/apache.
Related question is here: yeoman and angular utf8 issue and caching
Insert
#charset "utf-8"
at the top of your file and make sure you've saved the file in UTF-8.
Helpful link
Takie this lower text and comment it, i mean use
//comment blabla
In your css file.
can someone explain what is the difference in accessing CSS in browser by putting question mark ? in the end and why the new CSS is not making any affects on Website.
I have deployed a new CSS on web server but its not making any affect.
I tried to open the URL in browser as below:
www.mysite.com/styles/css/main.css
and it loads the older version of CSS.
Then I tried it as below and it loads the new version of CSS.
www.mysite.com/styles/css/main.css?
After doing all this. New CSS change does not affecting the website. Its still displaying the old design.
Kind Regards
You need to add something after the ? then change it when you change the CSS. What is happening is a browser will cache anything that doesn't change for a specific period, it does that by checking file names. so main.css? is still main.css? Anything after the question mark is a query string, generally it's used to pass data to a particular file. In this case it's just used to change the file string so the browser will update it every time it changes without affecting the file itself.
There are a couple of ways you can handle this, the first is manually changing the version, probably the easiest idea if you have a single header file, as in a template system that always loads the same head data.
<link rel="stylesheet" type="text/css" href="assets/css/main.css?ver1/>
Then on next change:
<link rel="stylesheet" type="text/css" href="assets/css/main.css?ver2/>
If you'd rather do it automatically you can add a bit of PHP script to the css line like this:
<link rel="stylesheet" type="text/css" href="assets/css/main.css?time=<?php echo filemtime('./assets/css/main.css');?>" />
This is essentially adding a value that changes every time you save the file and results in something like this, the next time I save the file that time= value will change:
<link rel="stylesheet" type="text/css" href="http://localhost/refficient/trunk/assets/css/main.css?time=1350305706" />
browser cache is the reason,Adding ? after css is not recommended.Open your hosting space and clear cache and thread pool as well.
I usually after css modification, change the version of css file in master.
then i must upload css file and master file.
is there any solution to change css version without need to upload master.
<link rel="stylesheet" href="<%=ResolveUrl("~/themes/default/style.css?v2") %>" type="text/css"/>
i am using asp.net.
Seeing how you do not want to change anything but the CSS file itself you could write a custom method which wraps ResolveURL and appends the last modified date of the css file in a set format (i.e. MMddyyhhmmss). This would automatically update whenever the file gets changed.
Something along the lines of:
<link href="<%= VersionCssUrl("~/Styles/Site.css") %>" rel="stylesheet" type="text/css" />
C#:
public string VersionCssUrl(string url)
{
// Get physical path.
var path = HttpContext.Current.Server.MapPath(url);
return String.Format("{0}?{1}",
ResolveUrl(url),
File.GetLastWriteTime(path).ToString("MMddyyhhmmss"));
}
Alternatively, it might be worth looking into any of these:
Shinkansen
ClientDependency
Cassette, as mentioned by TJB
.NET built-in bundling
There are lots of automated solutions for this now-a-days
Cassette # http://getcassette.net/ is open source
It will detect changes in the .css files and if you use their markup it will automatically append a hash (so you don't even have to manually update the version!)
They have installation via Nuget which simplifies the configuration / setup.
I'm having a css file and i want to modify it to fit my needs.
The problem is that it seems to be cached somewhere, as i just cannot see the changes, no matter what i do in the css file.
I am sure i am pointing to the right file, as by now i'v modified in it, and it worked.
Is there any setting so that i can turn the cache off?
Thanks!
As pointed out in this article http://www.wkoorts.com/wkblog/2009/07/12/css-auto-reload-with-django-templates/, you could force django reload your css file by using a parameter in your css link :
<link rel="stylesheet" type="text/css" href="/site_media/css/style.css?{% now "U" %}" />
This is a timestamp which takes a different value every second, so you could even reload your css second every second if needed!
Just go into your site, view source, and copy the link to your CSS file. Verify the link, verify it's being modified. Refresh the CSS file manually via your browser to get the latest.
This isn't a Django issue.
Did you try appending a datetime stamp to the end of the request? I know some frameworks do this to .js and .css files automatically to prevent caching.
Instead of using complicated solutions you can add extra parameter to your includes in the templates.
For static includes:
<script src="{% static 'js/polls/polls.js' %}?version=1"></script>
For direct includes:
<link rel="stylesheet" type="text/css" href="/site_media/css/style.css?version=1" />
Note the ?version=1 in the code. Every time you're modifying the file, change this version in the template, so browser will be forced to reload the file.
Of course you can use even now as suggested by #rom, but if your static files are not being changed very often, it's not the smartest idea to don't use cache at all.
the font of the content of my facebook app keeps getting italicized even when i've removed the italics from the css file. if i make minor changes in the css file and upload it to the server, the firebug shows the unedited previous css file and hence, the app keeps showing unformatted content. what exactly is going wrong here?
i made a new css file and copied the contents of the previous css exactly as it was, and i linked it in all the files which require css. but when i upload these files to the server, facebook canvas doesn't show any css at all. i replaced the css filename with the previous one, and it works. why is this?
Actually it looks like facebook is currently experiencing some weird problems with styling. It doesn't cache any new styles, only displays what was previously cached (from yesterday). If you provide a new stylesheet url it will not be able to pull it up (like that url doesn't exist).
During normal conditions what others already suggested should work.
Facebook does like to cache things. Persistently. I don't know why the new file wouldn't have worked, by I can recommend 'spoofing' your css filename with a spurious querystring variable, and incrementing it each time you make an update.
eg
href="my_css_file.css?x=1"
Sounds like the browser is caching your CSS file, which is why even Firebug sees the older version.
There are numerous ways you can prevent the browser from caching your CSS file during development (once in production mode, you probably want it to remain in the cache). The most common technique used by web frameworks like Ruby on Rails is to append a random query string to the URL, like so:
<link rel="stylesheet" type="text/css" href="style.css?96234987" />
...but the trick is that it should be different every time, so the browser thinks it's a different file.
Here are links to a simple trick for PHP, a JSP example, and other possible methods.
According to Include files on facebook developer wiki:
Stylesheet includes are cached automatically by Facebook. Just include a tag like:
<link rel="stylesheet" type="text/css" media="screen"
href="http://yourapp.com/stylesheets/style.css?v=1.0" />
Increment the version number upon each change to your style sheet, as specified above.