Mobilde Carousel Kayması Neden Kaynaklanıyor ?

Slider alanında bulunan bu kod içerisinde slider görseline genişlik verildiği için diğer eklenen carouseller mobilde yan yana 3 lü gelmektedir.

<img width="1920" height="663" src="/Upload/Slide/@slide.SlideImage" class="ls-bg" alt="@slide.SlideTitle" />

Burada genişlik %100 yapılmalıdır.

<img width="100%" height="663" src="/Upload/Slide/@slide.SlideImage" class="ls-bg" alt="@slide.SlideTitle" />

<div id="slider" style="height:663px;margin:0 auto;margin-bottom: 0px;">
    @foreach (Slide slide in Partial.Slides(lang))
    {
    <div class="ls-slide" data-ls="duration:4000; transition2d:8; kenburnsscale:1.2;">
        <img width="1920" height="663" src="/Upload/Slide/@slide.SlideImage" class="ls-bg" alt="@slide.SlideTitle" />
        <p style="font-weight:600;width:700px; cursive; font-size:42px; line-height:76px; color: #04033e; top:45%; left:40%; white-space:normal;" class="ls-l" data-ls="offsetyin:150; durationin:700; delayin:200; easingin:easeOutQuint; rotatexin:20; scalexin:1.4; offsetyout:600; durationout:400; parallaxlevel:0;">
            @slide.SlideTitle
        </p>
        <p style="font-weight:600;width:700px; font-family:Poppins; font-size:27px; line-height:76px; color:#343434; top:51%; left:40%; white-space:normal;" class="ls-l" data-ls="offsetyin:150; durationin:700; delayin:200; easingin:easeOutQuint; rotatexin:20; scalexin:1.4; offsetyout:600; durationout:400; parallaxlevel:0;">
            @Partial.SlideMeta(slide.SlideID, "Kısa Başlık")
        </p>
        <p style="font-weight:400;font-family:Poppins; font-size:25px; line-height:20px; color:#333333; top:56%; left:28%;" class="ls-l" data-ls="offsetyin:150; durationin:700; easingin:easeOutQuint; rotatexin:20; scalexin:1.4; offsetyout:600; durationout:400; parallaxlevel:0;">@slide.SlideContent</p>
        @*
        <a style="" title="@slide.SlideTitle" class="ls-l" href="@slide.SlideLink" target="_self" data-ls="offsetyin:150; durationin:700; delayin:400; easingin:easeOutQuint; rotatexin:20; scalexin:1.4; offsetyout:600; durationout:400; hover:true; hoveropacity:1; hoverbgcolor:#e74c3c ; parallaxlevel:0;">

            <p style="cursor:pointer;padding-top:10px; padding-bottom:6px; font-family:Poppins; font-size:14px; top:63%; left:25%; background:rgba(0,0,0,0.7); color:#ffffff; padding-right:25px; padding-left:25px; line-height:28px; border-radius:2px;" class="">@Partial.SlideMeta(slide.SlideID, "Buton")</p>
        </a>*@
    </div>
    }
</div>