如何在div中包含div？

Question

我有2列，50％和50％ 我想在左侧包含Slick Slider，然后在右侧包含消息和按钮。 但我不知道如何包含滑动滑块，请帮助。

Picture

的底部是我固定一个，它应该看起来像上面

在这里，一个是我的代码：
科events.jade：

section.events 
    .flex.flex--center 
     .col-50 
      .single-item 
       .item.item1 item 1 
       .item.item2 item 2 
       .item.item3 item 3 
       .item.item4 item 4 

     .col-50.flex.flex--center 
      .col-1 
       .desc-wrap 
        p.home-lead.outdented ...Current news and events... 
        a(href="").home-cta See All News 

style.sass：

.flex 
    display: flex 

.flex--center 
    justify-content: center 

.col-1 
width: 320px 
padding: 0 10px 
box-sizing: border-box 

.col-50 
width: 50% 

@media (max-width: 640px) 

.col-1 
    width: 100% 

.col-50 
    width: auto 

科events.sass

section.events 
    background: 
     image: url(../img/events-bg.jpg) 
     position: center 
     size: cover 

    .home-lead 
     color: white 

    .home-sections & 
     padding: 0 

     @media (max-width: 640px) 
      padding-bottom: 50px 

    .col-1 
     display: flex 
     align-items: center 

     @media (max-width: 640px) 
      display: block 

    .home-cta 
     color: white 
     background: #F06292 

    .col-50 
     .single-item 
      width: 50% 
      position: absolute 

      .item 
       width: 100% 
       height: 100% 
       text-align: center 
       line-height: 300px 
       color: white 
       font-size: 30px 

      .item1 
       background: 
        image: url(../img/events-bg.jpg) 
        position: center 
        size: cover 

      .item2 
       background: 
        image: url(../img/academics-bg.jpg) 
        position: center 
        size: cover 

      .item3 
       background: 
        image: url(../img/about-bg.jpg) 
        position: center 
        size: cover 

      .item4 
       background: 
        image: url(../img/events-bg.jpg) 
        position: center 
        size: cover 

Answer 1

.col-1 
    width: 100% 

应该是50%和其他地方发生.col-1。