OiO.lk Community platform!

Oio.lk is an excellent forum for developers, providing a wide range of resources, discussions, and support for those in the developer community. Join oio.lk today to connect with like-minded professionals, share insights, and stay updated on the latest trends and technologies in the development field.
  You need to log in or register to access the solved answers to this problem.
  • You have reached the maximum number of guest views allowed
  • Please register below to remove this limitation

How can I center items in Slick Carousel?

  • Thread starter Thread starter cjm
  • Start date Start date
C

cjm

Guest
I'm using the Slick Carousel, but there's one layout itch I can't scratch. When I have fewer items than the carousel can display at once, they're left-justified. I'd like them to be centered. For example, with slidesToShow equal 3 and only 2 items, I get

Code:
-------------------
 IIIII IIIII
-------------------

when what I want is

Code:
-------------------
    IIIII IIIII
-------------------

or if there's only 1 item:

Code:
-------------------
       IIIII
-------------------

I've tried setting centerMode, but that's a completely different effect.

Is there a way to get the effect I want? It needs to handle slidesToShow being reduced by responsive breakpoints.

<p>I'm using the <a href="http://kenwheeler.github.io/slick/" rel="noreferrer">Slick Carousel</a>, but there's one layout itch I can't scratch. When I have fewer items than the carousel can display at once, they're left-justified. I'd like them to be centered. For example, with <code>slidesToShow</code> equal 3 and only 2 items, I get</p>

<pre><code>-------------------
IIIII IIIII
-------------------
</code></pre>

<p>when what I want is</p>

<pre><code>-------------------
IIIII IIIII
-------------------
</code></pre>

<p>or if there's only 1 item:</p>

<pre><code>-------------------
IIIII
-------------------
</code></pre>

<p>I've tried setting <code>centerMode</code>, but that's a completely different effect.</p>

<p>Is there a way to get the effect I want? It needs to handle <code>slidesToShow</code> being reduced by responsive breakpoints.</p>
 
Top