ブラウザでのコーディング確認が出来ず、困り果てています！

コーディング初心者です。
現在、LPの依頼を受けて作業をしております。
（Macbook Air M1チップ　11.2.3 でAtomを使用しています）
HTMLの記述段階では、数行書いてはFinderで表示させて確認、、と繰り返し行い
問題なく出来ていました。ところがいざCSSの記述に入って、ちゃんと効いているかどうか
を確認しようと思い、同様の「Finderで表示」をしたところ、LPの最上部（headerとメイン画像のみ）が表示され、トラックパットを二本指でシャカシャカしてもスクロール出来ません。
LPですので、結構な長尺で、メイン画像の下には他の素材が色々詰まっています。
ブラウザをchromeからsafariに変更してみたのですが、同じでした。
またOSの初期化、検索履歴の削除、色々やっているのですが、、、お手上げです。
因みに、head内に記述したリセットCSSは
<link rel="stylesheet" href="https://unpkg.com/ress/dist/ress.min.css">
で、Web上に公開されているものから引っ張ってます。
もちろんその下段に自分のCSSファイルも記述しています。
この二つのリンクをコメントアウトすると、当然の事ながらHTMLだけになって、Finder表示ができ、スクロールも出来ます。でもこれではCSSの確認が出来ないので意味がありません。。。
cssのファイルをダウンロードして、CSSフォルダに入れてリンクさせてみたのですがそれもだめでした。どなたか、このような事例を解決された方はいませんか？
教えていただけると助かります。

よろしくお願い申し上げます。

質問者からの補足コメント

• body タグにoverflow:hiddenを書いた事が要因でした。解決しました！

    補足日時：2021/03/17 16:15

No.2 回答者： bx2 回答日時： 2021/03/17 13:10

原因は HTML にあるかも知れません。

開始タグがあるのに、終了タグがないとか、構造的な問題があるのでは？

デベロッパーツールを使えば、エラー箇所の指摘が出るかも知れません。

ブラウザーの表示結果だけでなく、自分が書いたコードも目視で確認した方が良いです。

コードを読み返せば不具合が見つかる場合があります。結果しか見ない人は不具合を見落とします。

この回答へのお礼

ご回答ありがとうございます。
今デベロッパーツールで検証してみたのですが、特に警告の黄色い三角は出てきませんでした。
以前はちゃんと確認できていたのになんで急にできなくなるのか不思議です、、、、

お礼日時：2021/03/17 13:23

No.1 回答者： dyna_1550 回答日時： 2021/03/17 11:47

困ってるポイントがよく理解できないのですが、HTMLの開発をしたいのであれば、以下が便利です。

・GoogleChromeを使って、「デベロッパツール」を起動する

CSSの適用状況などがすぐに目視できます。
また、デベロッパツールで「キャッシュを無効にする」というのも操作を覚えておくと便利だと思います。

この回答へのお礼

ご回答ありがとうございます。
クロームのデベロッパーツールは使わず、MacのFinder表示の方が簡単に確認できるので、いつもそっちを使っています。右クリックで選択するだけでブラウザでの表示が確認出来ますので、、
キャッシュは上記に書いた通り、検索履歴は全て削除済です。
positionをfixなどにしたわけでもないのになんで画面がスクロールしないのか全くわかりません。

お礼日時：2021/03/17 12:19