Maria Jane Maria Jane - 7 months ago 58
CSS Question

vertical align (center center) a slider doesn't work

Imagine #bg is my body, and I want to make the slider (slick slider center center) for every slides. The plugin already has advaptive height but I just coulnd't make it center center on #bg.

I tried vertical align trick like

.vcenter {
position: relative;
top: 50%;
transform: translateY(-50%);

but it just doesn't help.


Use flex to center the content vertically. like this

   height: 600px;
   display: flex;
   align-items: center;
   justify-content: center;

Check updated fiddle HERE.

Read flex in detail HERE