スクロールバーがついているのにスクロールしない

前提・実現したいこと

画像を横スクロールさせたいんですが、スクロールバーがついただけで動きません。どうしてでしょうか？

該当のソースコード

HTML
1<div class="table-image fadein-el">
2     <img src="images/tableimage.png" alt="">
3</div>

SCSS
1.servicepage-second {
2    .table-image {
3        width: 200%;
4        height: auto;
5        margin: 70px 0 120px;
6        display: block;
7        img {
8            width: 100%;
9        }
10 }
11@media(max-width: 768px) {
12.servicepage-second {
13         .table-image {
14              overflow-x: scroll;
15              white-space: nowrap;
16              width: 200%;
17              margin: 40px 0 70px;
18              img {
19                  width: 200%;
20                  height: auto;
21                  display: inline-block;
22              }
23}

問題箇所の追記

上記のコードでは問題が再現できなかったという情報をいただいたのですが、下記のコードもスクロールができません。こちらも問題を共有できないでしょうか。

HTML
1<div class="second-website-images-scroll">
2         <img src="images/Corporatesite.png" alt="">
3         <img src="images/writing.png" alt="">
4         <img src="images/namecard.png" alt="">
5</div><!-- /second-website-image-scroll -->

SCSS
1 .second-website-images {
2           display: flex;
3           flex-flow: wrap;
4           padding: 10px 0 100px;
5           .second-website-images-scroll {
6               display: flex;
7               justify-content: center;
8               gap: 50px;
9               margin-bottom: 80px;
10           }
11}
12@media(max-widt: 768px) {
13 .second-website-images {
14          .second-website-images-scroll {
15              overflow-x: scroll;
16              white-space: nowrap;
17              gap: 20px;
18          }
19 }
20}

試したこと

widthの値を変えたり、displayを変えたりと色々試していたので余計なプロパティがあるかもしれません。親要素にoverflowが必要とでてきたので親要素を追加。white-spaceもつけなければならないという情報もありましたが、テキストをスクロールさせるときだけなんでしょうか。

補足情報（FW/ツールのバージョンなど）

Macbook Air M1

Lhankor_Mhy

2022/06/21 09:24

ご提示のコードを試してみましたが、問題が再現しませんでした。おそらく、ご提示の部分には原因はなさそうに思います。ご提示いただいていない部分に原因があるか、問題の共有が上手くできていないと思います。問題再現の手順をもう少し詳しく書いていただけますか？

amagiri

2022/06/21 09:59

検証ツールでCSSを調べたところ、overflow-x: scroll;の部分が薄暗くなっていたのですが、何か関係はあるのでしょうか？チェックを外すとスクロールバーが消えたのでプロパティが無効化されているわけではないようです。申し訳ありませんが問題再現の手順とは具体的に何をお伝えすればいいでしょうか？

amagiri

2022/06/21 10:01

すみません、Live Serverでサイトを表示していたことに原因があるということがわかりました。htmlの相対パスをChromeに貼り付けてサイトを開いたところ、問題なくスクロールしました。