じ他のcssは読み込めるが,ある１つのcssだけがブラウザで読み込まれない

Question

問題

サーバへアップロードしたcssファイルがブラウザに読み込まれない

環境

Ubuntu １６．０４
chrome

やりたいこと

app.e08a958ae3e530145318b6373195c765.cssというcssを読み込みたい

chromeの検証を使ってみると他のcssは読み込めているみたい

![]

common.cssは@charsetを忘れていたみたいです、すいません

だけどやはりapp.e08a958ae3e530145318b6373195c765.cssは読み込まれていない？
読み込まれているけどファイルの中が何もない？

ディレクトリ構成

.
├── aset
│   ├── app.css
│   ├── common.css
├── index.html

このようになっています。

ちなみにapp.e08a958ae3e530145318b6373195c765.cssの中は以下の通り

/*! TACHYONS v4.9.1 | http://tachyons.io */

/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,footer,header,nav,section{display:block}h1{font-size:2em;margin:.67em 0}figcaption,figure,main{display:block}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent;-webkit-text-decoration-skip:objects}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit;font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}dfn{font-style:italic}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{font-family:sans-serif;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item}canvas{display:inline-block}[hidden],template{display:none}.border-box,a,article,aside,blockquote,body,code,dd,div,dl,dt,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,html,input[type=email],input[type=number],input[type=password],input[type=tel],input[type=text],input[type=url],legend,li,main,nav,ol,p,pre,section,table,td,textarea,th,tr,ul{box-sizing:border-box}.aspect-ratio{height:0;position:relative}.aspect-ratio--16x9{padding-bottom:56.25%}.aspect-ratio--9x16{padding-bottom:177.77%}.aspect-ratio--4x3{padding-bottom:75%}.aspect-ratio--3x4{padding-bottom:133.33%}.aspect-ratio--6x4{padding-bottom:66.6%}.aspect-ratio--4x6{padding-bottom:150%}.aspect-ratio--8x5{padding-bottom:62.5%}.aspect-ratio--5x8{padding-bottom:160%}.aspect-ratio--7x5{padding-bottom:71.42%}.aspect-ratio--5x7{padding-bottom:140%}.aspect-ratio--1x1{padding-bottom:100%}.aspect-ratio--object{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:100}@media screen and (min-width:30em){.aspect-ratio-ns{height:0;position:relative}.aspect-ratio--16x9-ns{padding-bottom:56.25%}.aspect-ratio--9x16-ns{padding-bottom:177.77%}.aspect-ratio--4x3-ns{padding-bottom:75%}.aspect-rat..........

普通のcssのようではなく連続して表記されています。

HTMLでのcss指定部分

# index.html

<link href="aset/app.css" type="text/css" rel="stylesheet" />

<link href="aset/app.css" type="text/css" rel="stylesheet"; charset=UTF-8 />
でもやってみましたができませんでした。

どなたか、知恵をお貸しください。お願いします。

Comments

[x_x]

読み込めていると言っていますが文字化けしているように見えます。@charsetはちゃんと書いているのでしょうか？

[Laughingkitten]

すいません、例に出したやつは@charsetが抜けていたみたいです。修正しました。その他のcssはやはり正常に読み込まれているように思えます...

[yoshinavi]

HTMLの読み込み部分の誤字脱字等はどうですか？ここも提示されると良いかと思います。

[Laughingkitten]

情報追加しました、問題のcssファイルをapp.cssというファイル名にリネームして、指定しています。

Answer 1

回答していただいたみなさま、申し訳ありません。
大事な情報を記載し忘れていました。
Webサーバの種類についてです。
さらに、apache2を使用していると思ったいたのですが、Webサーバがnginxに変更されていました...
それとstaticfileのrootも変更されていた様です...

nginxの設定の問題でした

#　/etc/nginx/nginx.conf

sendfile off;
に変更

location ~* ^.+.(jpg|jpeg|gif|css|png|js|ico)$ を変更

することで表示できました。
みなさま、知恵を貸していただきありがとうございました。

Answer 2

ファイル名を変えてみたらいかがでしょうか？

例えば app.css みたいに変えればもしかしたらうまく行くかもしれません。

ファイル名に . が入っているので拡張子と勘違いされて読み込まれないのでしょうか？？
予想ですが、一意見として。

良かったら試して見てください。

Comments

[Laughingkitten]

回答ありがとうございます。
app.cssにして試してみましたが、現状変わらずですね...
app.cssファイルの中は空のままです。