あべろぐぷらす

元SEが半農半Xな暮らしを目指して頑張る様子を福島から発信するブログ

ブログデザイン修正中にぶち当たった『mui.min.css』が全く理解できない件について

f:id:abeshi01:20180204121600p:plain

こんにちは、あべし(@honjituno)です。ブログのデザインが何かおかしいと気が付いてから2週間。いまもブログデザイン修正中です!だんだん元の姿に戻ってきていますよ!

ブログデザイン修正中にぶち当たった『mui.min.css』が全く理解できない件について

先日ブログのデザインが崩れていることに気が付き、そこから苦労しつつもデザイン修正に励んでいます。徐々にではありますが、ブログのデザインが元の姿にもどりつつあります! 

www.abelog-plus.com

突破のきっかけになったのは、『LIFEPORT』さんのブログを読んだことです。とても参考になりました!『この手があったか!』と目からうろこでした。

www.lifeport-gurigura.jp

本来は自分が選んだデザインテーマのファイルを読み込んで、そのデザインを反映させています。その箇所を、『もういっそのこと、自分のCSSに直接張り付けてしまえ!!』という荒業です!

 

『直接貼り付けることで、どんないいことがあるの??』とお思いでしょう。こうすることによって、CSSを自由に書き換えることができるようになります。

 

そのままだと『このファイルを読み込みます!』というコードしか書かれていなかったので、元のコードに手を出すことができずにいました。

 

しかし、コードを変更可能になれば手はまだあります。

原因は『mui.min.css』??

ところで、そもそもデザインが崩れてしまっている原因は何なのでしょうか??

 

気が付いた時からその原因を調べていましたが、デザイン崩れの原因となっている箇所を発見しました。どうやら『mui.min.css』というものが原因になっているっぽいです。

 

どうしてそう思ったかというと、このcssが一番優先されてしまっているから。Chromeの『右クリック→検証』で確認したので間違いないと思われます。

 

んで、『mui.min.css』について調査してみましたが、こんなブログを発見しました。

keiwt.hatenablog.com

でも、『わからない…。』聞いたことはあるフレームワークというワード…。仕方がないので、ここから先を追及するのはひとまずお休みすることにしました。

結局『!important』で修正!!

そんなこんなで原因らしきものを突き止めたものの、対処法までは分からず…。そんなぼくにできることといったら、結局『!importantで修正!!』です笑。

 

先日のブログで気になっていた箇所は大体修正しました!もう仕方ないのです!

 

ただ、この方法だと自分では気が付いていないけど、デザインが崩れてしまっている箇所には気が付けないです。でも、根本原因には対処しようがないので、当分はこれでいこうと思います。

まとめ

原因箇所を特定するも、対処法は分からずでした…。どんどんはりぼて感が出てしまいますが、今は仕方なしです。

 

それにしても『mui.min.css』って何なのでしょうか??どうして突然登場して、そちらのCSSが優先して適用されてしまっているのでしょうか??そんな設定をした記憶はないのですが…。

 

まだ修正が完了したわけではありません。デザイン修正とともに、これまで作業が中断してしまっていた『アフィリエイトリンク』の差し替え作業も始めてしまいました。過去記事をエンドレスでリライトしています。まだ作業は続いていくので、原因への対処が完了するまで頑張りますよ!それではー!