Q&A
ひとつ質問なのですが、ファイル名を`index.html`に戻した場合、リンクや画像のずれは改善されるのでしょうか？
HTMLファイルのファイル名を変更したところ、
表示した際のリンクや画像の位置がずれてしまいます。HTMLやCSSの中身は変更していません。
また、格納するフォルダを変更しても位置ずれしてしまいます。
考えられる原因がありましたら教えてください。
・ファイル名変更例
index.html→index_.html
はい、改善されます。
しかし、ファイル名変更したあとの表示が理想なので、ファイル名を戻してもレイアウトがそのままになってほしいです。
使われているHTML、CSSともに見せていただいたほうが話は早いと思います。見せて行けないところは隠してアップして下さい。
すみません、仕事の都合上公開するのは厳しいです。スマホとPCで表示内容を分けているのでそれが影響しているかもしれません。
純粋なHTML,CSSだけ作ってますか？コンパイルが必要な環境でしょうか？
通常では起きない症状だと思いますが、情報が少ないので何とも･･･ファイル構成等分かるモノも欲しいですね。 キャッシュクリア後の確認でしょうか？ デベロッパーツールでみれば、どのCSSが適用されているか確認出来るのでは無いでしょうか？
＞oikashinoaさん HTML、CSS、JavaScriptを使用しています。コンパイルは不要です。
> yoshinaviさん ファイル構成は、どのフォルダに何のファイルが入っているかが確認できればよいでしょうか。キャッシュクリア後の確認となります。ありがとうございます。デベロッパーツールでの確認してみます。
ファイル構成について → 他の方の質問になりますが、ファイル構成をテキストのみで表現される方がいましたが、非常に分かりにくく、誤解を生じるので、出来れば簡単で良いので図として表示されると良いかと思います。（テキストでも記号等で分かりやすくはなります。） それと併せて、CSSを読み込んでいる箇所も提示されると、より良い回答を得れると思います。
「think49」さんの回答のコメントに「＞適用されるCSSは見える･･･」とありますが、結果はどうなのでしょうか？ コピーは「Ctrl+A」で選択しコピー出来ないでしょうか？
回答1件
0
ベストアンサー
考えられる可能性
- リクエストURIを見て、サーバサイドでCSS出力を変更している
レイアウトが崩れる要素の適用CSSを見て、外部CSSのURIにあたりをつけてから、grepでCSS出力部分を検索して下さい。
切り分け
それぞれのケースで差分比較(diff)すべきだと思います。
index.htmlで出力されるCSSindex_.htmlで出力されるCSS
開発者ツールでレイアウトが崩れる要素を選択して、適用されるCSSに違いがないか確認するだけでも違いを確認出来るのではないでしょうか。
それで確認不可能なら、外部CSSを一つずつ確認するしかないですね。
Re: Tiroze さん
投稿2018/06/29 00:02
総合スコア18162
回答頂きありがとうございます。適用されるCSSに違いがないか確認してみます。
Chromeの開発者ツールを使用しており、適用されるCSSは見えるのですが、コピーすることができない状況です。コピーする方法がありましたら教えて頂けますでしょうか。
あたりをつけた要素の [Styles] タブで [Ctrl] + [A] -> [Ctrl] + [C]
https://developers.google.com/web/tools/chrome-devtools/inspect-styles/?hl=ja
[Network] タブでcssファイルを全てDLして、diff
https://developers.google.com/web/tools/chrome-devtools/network-performance/resource-loading?hl=ja
ありがとうございます。
再度画面を表示して見たところ、ページ拡大をしていたため、表示がずれていたようです。お手数おかけしました。
あなたの回答
tips
プレビュー
