Home>

This siteI'm trying to create a slider listed in, but I'm having a problem because the images are lined up vertically and don't look like a slider.

On that page, there is a custom method that can be done by copyingSeparate articleI tried it from here, but it didn't work.

It will be lined up vertically like this.

I want to make it look like this.

Corresponding source code

It will be a copy and paste of the site, but the code you typed in

<head>
<!-Css file->
<link rel = "stylesheet" href = "https: // www. (File storage location) /style.css" media = "all"><!-Css in places other than slider->
<link rel = "stylesheet" type = "text/css" href = "https: // www. (File storage location) /slick.css">
<link rel = "stylesheet" type = "text/css" href = "https: // www. (File storage location) /slick-theme.css">
<script type = "text/javascript" src = "https: // www. (File storage location) /slick.min.js"></script>
<script src = "https: // www. (File storage location) /jquery-1.10.2.min.js"></script>
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<!-Slider from here
******************->
<script>
$("document"). ready (function () {
  $('.mypattern'). Slick ({
    autoplay: true,
    autoplaySpeed: 2500,
    speed: 800,
    dots: true,
    arrows: false,
    centerMode: true,
    centerPadding: '10%'
  });
});
</script>
<style>
  * {
    margin: 0;
    padding: 0;
  }
  .slider {
    width: 90%;
    margin: 0 auto 80px;
  }
  .slick-slide img {
    width: 100%;
    height: auto;
  }
  .mypattern {
    width: 100%;
  }
  .mypattern .slick-slide {
    margin: 5px;
  }
</style>

  
        
        
        
        
  
What I tried

I saw that there was a case where I could cure it by putting

  • Answer # 1

    Hello.

    Try the following

    Delete

    ToPut after

Related articles