slickで作成したスライダーをレスポンシブ対応させたい。

Question

前提・実現したいこと

slickで作成したスライダーをレスポンシブ対応させたい。
pc画面ではスライド画像の枚数は4枚でスマホ表示の時は一枚にしたい。

発生している問題・エラーメッセージ

調べてレスポンシブの記述をしたのだが何故かレスポンシブ表示されない

該当のソースコード

<div class="footer-slider__inner">
        <div class="footer-slider">
            <ul class="footer-slider__list">
                <li><a href="#"><img src="" alt=""></a></li>
                <li><a href="#"><img src="" alt=""></a></li>
                <li><a href="#"><img src="" alt=""></a></li>
                <li><a href="#"><img src="" alt=""></a></li>
                <li><a href="#"><img src="" alt=""></a></li>
                <li><a href="#"><img src="" alt=""></a></li>
                <li><a href="#"><img src="" alt=""></a></li>
                <li><a href="#"><img src="" alt=""></a></li>
                <li><a href="#"><img src="" alt=""></a></li>
                <li><a href="#"><img src="" alt=""></a></li>
            </ul>
        </div>
    </div>

.footer-slider__inner{
    margin: 0 auto;
    background-color: $footer-slider__inner;
    max-width: 1024px;
    padding: 20px;
    .footer-slider{

        background-color: $footer-slider__back;
        padding: 10px;
        .footer-slider__list{
            background-color: $footer-slider__list;
            width: 825px;
            margin: 0 auto;
            li{
                a{
                    img{

                    }
                }
            }
        }
    }
}

$('.footer-slider__list').slick({
    autoplay:true,
    autoplaySpeed:5000,
    dots:true,
    slidesToShow:4,
    slidesToScroll:1,
    responsive:[
        {
            breakpoint: 1024,
            settings:{
                slidesToShow:3,
            }
        },
        {
            breakpoint: 768,
            settings:{
                slidesToShow:2,
            }
        },
        {
            breakpoint: 480,
            settings:{
                slidesToShow:1,
                slidesToScroll:1,
            }
        },
    ]
});

### 試したこと

調べてブレイクポイントを指定したが表示枚数が変わらない

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

ここにより詳細な情報を記載してください。

Comments

[Lhankor_Mhy]

「レスポンシブ表示されない」とは具体的には何ですか？

[cafe1111]

写真の通りです。
他のレイアウトをまだそれえていませんので、全体の見栄えが悪いのは申し訳ないです。

[Lhankor_Mhy]

ご提示のコードを試してみましたが、当方では表示枚数が変わりました。
つまり、問題が再現しませんでした。

Answer 1

もしかしてmeta viewportを入れ忘れとかではないでしょうか？