CSS @Import: Imported .css file has sources that are urls
I have a little problem that I just cant solve. I have a css-file that imports another css-file which contains a font. Now this imported css-file has a list of these e.g:
src: url(my-font.eot)
When I publish the site, it does not find the font files. I have tried all sorts of paths such as:
src: url(../Content/css/<filenamehere>.eot
src: url(../css/<filenamehere>.eot
I know the font-css is in the server and import from the main.css works because there are two files that are imported and the other one works fine.
EDIT: My Imports look like this:
@import url('../css/stuff1/stuff1.css');
@import url('../css/stuff开发者_开发问答2/stuff2.css');
/EDIT
What paths should I give to these font files in the font-css?
Your best bet is to use absolute paths everywhere all the time, relative paths just cause trouble and introduce unnecessary coupling and brittleness. I don't know your exact structure but I think you probably want this:
src: url(/css/<filenamehere>.eot);
Or possibly this:
src: url(/Content/css/<filenamehere>.eot);
The same advice applies to referencing your CSS and JavaScript files.
After going through the server's files. I found that not all of the font files were sent to the server during publishing. After copy and pasting all the font files to the server the font was found and was loaded when browsing the site. Apparently there was nothing wrong with the imports. Thank you for your assistance.
精彩评论